[RISOLTO] Ridimensionamento automatico immagini nel <div> header

[Marcolène]

Ciao,
non so se è questa la sezione giusta per postare questo problema, intanto spiego la situazione:
template di default, protostar, ho inserito un logo immagine, a questo logo devo sovrappore 3 immagini, a parte, perché voglio applicare loro stili ed effetti diversi, ma soprattutto effettuare un reindirizzamento diverso da quello previsto per il logo, che reindirizza alla Home. Modificando il file index.php del template, ho inserito le tre immagini in un <div> e le ho sovrapposte, dando le coordinate esatte, al logo. In pratica ho aggiunto del codice html alla variabile $logo e in seguito ho modificato il file template.css per impostare il posizionamento. Ora, se io restringo la finestra del browser, le 3 immagini non si adattano alle dimensioni dello header, ma escono fuori andando a nascondersi sotto al menu principale. è possibile applicare una classe al <div> delle tre immagini in modo che si adattino allo header?

[alessioa]

Ciao,

appurato che con un link tutto sarebbe più semplice.

Se hai aggiunto il div puoi aggiungere anche una classe, apri il tuo div e per esempio :

<div class="tua_classe">
....
</div>

Per avere le immagini che si adattano, devi lavorare sul tag img aggiungendo il width in % e non in px, però così senza link è dura.

[Marcolène]

Ho risolto giorni fa facendo proprio come hai suggerito tu, dando le percentuali rispetto al box contenitore. Ho impostato l'attributo bottom ad ogni link (che contiene l'immagine), diverso per ognuno, in percentuale, dopo aver impostato position: absolute e position:relative al box contenitore. Quando la finestra viene ridimensionata i link/immagine mantengono la distanza dall'elemento in basso. Pensavo ci fosse un modo più semplice.


Grazie, ciao!