come spostare la slide show

[far]

salve, utilizzo il template putiry III e non riesco a trovare il file corporate.css per modificare il padding, voglio portare le slide attaccate al menu. dove trovo questo file
il sito è questo

[conti1]

qui
http://labonia.eu/templates/purity_iii/local/css/themes/orange/layouts/corporate.css

[far]

grazie conti1.
mi spieghi come hai fatto a trovare il percorso?

avendo azzerato il padding ora le slide si sino alzate (non si vede l'intera immagine) quindi dovrei abbassare le slide.

[Limma]

Il percorso lo trovi facilmente utilizzando un tool tipo FireBug o simili.

La regola css che hai ora in uso è questa:

Codice: [Seleziona]

.corporate .slideshow {
    background: #f7f7f7 none repeat scroll 0 0;
    border-bottom: 1px solid #eeeeee;
    padding: 0;
}Modificala così e la slide andrà giusto a filo sotto il menu:

Codice: [Seleziona]

.corporate .slideshow {
    background: #f7f7f7 none repeat scroll 0 0;
    border-bottom: 1px solid #eeeeee;
    padding-top: 40px;
}Come vedi ho modificato il parametro padding inserendo padding-top che, così come è settato, "porta giù" la slide. Nel caso lo aggiusti come preferisci.

P.S. Non modificherei il file corporate.css, ma inserirei la regola che ti serve nel custom.css

avendo azzerato il padding ora le slide si sino alzate (non si vede l'intera immagine) quindi dovrei abbassare le slide.

... Se l'avevi azzerato tu, il padding, perché non l'hai ripristinato?

[far]

salve,
sui dispositivi mobili il problema persisite
ho provato ma niente di fatto
a dire la verità con firebug funziona mentre quando carico lo stesso codice nel file custom.css le modifiche non vengono applicate

non riesco a capire perchè non si prende le specifiche del file custom.css ma devo intervenire sul file corporate

[conti1]

ciao il problema sui mobili ora e la contrario visto  iphone 7  la slide sale sotto il menu ora devi per cui  la modifica fatta non e proppio adeguata

[Limma]

... Veramente il problema c'è ancora anche nella versione desktop. Le immagini della slide sono ancora parzialmente coperte dal menu.

Nella classe .corporate .slideshow non c'è nessun padding impostato.

a dire la verità con firebug funziona mentre quando carico lo stesso codice nel file custom.css le modifiche non vengono applicate

non riesco a capire perchè non si prende le specifiche del file custom.css ma devo intervenire sul file corporate

Nel file custom.css dopo aver impostato il padding che ti serve aggiungi !important. Tipo:

Codice: [Seleziona]

padding-top: 40px !important;
Funziona benissimo.

[Limma]

Ho visto che adesso hai impostato il padding top nel corporate.css, e come vedi la slide è a posto anche nei dispositivi mobili.
Prima non lo era per l'assenza del padding...

Prova a fare la stessa modifica nel custom.css come ti ho scritto prima.
In ogni caso va bene uguale...

[far]

le specifiche che mi hai dato le ho applicate al dile custom.css ma con firebug visualizzo il file corporate.css.

Per quale motivo non visualizzo il file custom.css
sarebbe possibile impostare una dimensione diversa delle slide per i dispositivi mobili?

[Limma]

le specifiche che mi hai dato le ho applicate al dile custom.css ma con firebug visualizzo il file corporate.css.

Per quale motivo non visualizzo il file custom.css

... Il tuo file custom.css ha un "piccolo", ma vitale errore...
Nel codice che hai inserito:

Codice: [Seleziona]

corporate .slideshow {
    background: #f7f7f7 none repeat scroll 0 0;
    border-bottom: 1px solid #eeeeee;
    padding-top: 40px !important;
}manca il .(punto) prima di corporate, il che rende nulle le regole che hai inserito...!

[far]

anche inserendo il punto visualizzo sempre il file corporate.ss

[Limma]

... guarda bene... c'è, eccome se c'è...

Vedi immagine allegata appena presa dal tuo sito...!

[far]

forse dovevo cancellare le cake, ora mi sembra di visualizzarlo......

è possibile inserire delle dimensioni diverse per i dispositivi mobili

[Limma]

Intendi creare una slide con immagini di dimensioni più piccole, adatte agli smartphone?

[far]

a dire la verità un pò più alte tipo 320x200

ho visualizzato su firebug il dispositivo mobile e sai che mi da sempre questo file corporate.css

vorrei che l'altezza fosse fissa a 200 per i dispositivi mobili
mentre la larghezza varia al variare dei dispositivi

[Limma]

Puoi creare un nuovo modulo slide con le immagini delle dimensioni che preferisci e assegnarli un suffisso classe " visible-xs".

Non credo abbia senso e/o sia possibile settare un'altezza fissa delle immagini, ridimensionando solo la larghezza.
L'adattamento (finto) responsive delle immagini è proporzionale sui due assi...

L'argomento è un po' intricato e magari qualcuno ben più preparato di me ti può illuminare

[far]

Girando su internet ho trovato questo sito: pelignanet.it e ho notato che sugli schermi piccoli l'altezza la mantiene fissa. Potete darmi qualche suggerimento.

[tomtomeight]

Stessa altezza non significa altezza fissa, cioè se metti tutte le immagini stesse dimensioni avranno stessa altezza in rapporto a stesso dispositivi ma altezza diversa da dispositivi diversi.

[far]

Mi potete spiegare per quale motivo quel sito che ho lincato mantiene la stessa altezza X gli schermi piccoli. Quindi come dici dovrei aumentare l'altezza dell'immagine e il gioco è fatto....

[tomtomeight]

Mantiene la stessa altezza perché le immagini sono della stessa dimensione e soprattutto sono proporzionali alla massima larghezza ottimizzata per desktop.

In prativa se hai una immagine in origine larga 1024 x 450 questa in base al principio della responsività si ridimensionerà in base alla larghezza del dispositivo, se hai invece immagini diverse alcune lasceranno strisce nere o ai lati o sopra e sotto.
Metti immagini larghe almeno 1280 e tutte con stessa altezza, se non le hai ritagliale.
Per farti capire quelle del sito che hai preso ad esempio ha le immagini 4.160px × 1.617px (ridimensionata a 1.316px × 512px)

[far]

si le mie immaggini sono ritagliate 2060pxx712px
cosa significa ridimensionata a 1316px x 512px? significa che sono state ritagliate?

[tomtomeight]

Significa scalate, se le tue immagini sono tutte uguali avranno tutte la stessa altezza però devi mantenere un rapporto fra larghezza e altezza di 16/9 per avere una scalabilità ottimale altrimenti scalando troppo in larghezza ottieni una altezza troppo ridotta.

[far]

salve, ho provato a fare qualche prova e ho notato che se mantengo il rapporto 16/9 le immagini si vedono come desidero sui dispositivi mobili mentre per i pc le immaggini occupano tutto lo schermo. mentre vorrei che mantenessoro una altezza di 600 px.
quindi non riesco a capiere dove sbaglio per gli schermi grandi (pc).
ho allegato un file dove si vede la pagina del sito e non riesco a capire come posso rendere l'immagine larga per tutto lo schermo (ho segnato le frecce rosse).

[tomtomeight]

Aggiungi nel css una regola per massima altezza.

[far]

ottengo solo che l'immaggine mi viene tagliata superiore a quella altezza. quindi non ho risolto niente.

[tomtomeight]

Devi applicarla alla immagine non al contenitore
.

[far]

attraverso il modulo ari images slide modificando la larghezza e quindi portadola a 6250 px sono riuscito ad avere una larghezza a tutto schermo anche quando si riduce lo zoom le slide mandengono sempre la stessa larghezza. il problema è sempre l'altezza che ovviamente non riesco a controllare.
come posso mettere un limite all'altezza?
non riesco ad applicare l'altezza all'immaggine
il problema principale e che mantenendo il rapporto 16/9 l'immaggine la visualizzo bene sui dispositivi mobili ma troppo alta per i pc...... come si può risolvere