Leggi gli ultimi interventi sul forum
 
You are here: Sky ForumWebSviluppo webCssAllineare verticalmente le immagini al testo
Pagine: [1]
Allineare verticalmente le immagini al testo
0 Utenti e 1 Visitatore stanno guardando questo topic.
  • skydiamond
  • Amministratore
  • pr
  • *
  • Offline Offline
  • Posts: 883
  • skydiamond 
  • Guarda Profilo WWW
Allineare verticalmente le immagini al testo
« il: Maggio 25, 2008, 07:05:40 »

Se si vuole allineare un'immagine al testo in maniera tale che essa stia alla sinistra e che contemporaneamente il testo risulti all'altezza del centro dell'immagine bisogna disporre con float l'immagine a sinistra e con vertical-align stabilire l'allineamento dell'immagine stessa con il resto del documento. Potrebbe poi essere necessario evitare che in una parte del testo vengano allineate delle immagini a destra o a sinistra per farlo basta usare clear (left, right, both) per far sì che i lati vengano ripuliti dai float.  wink
Codice
GeSHi (html4strict):
<p>
<img src="pathimmagine/immagine.jpg" alt="la tua immagine" />
Testo allineato con la tua immagine
</p>
Created by GeSHI 1.0.7.20
     
Codice
GeSHi (css):
p img{
vertical-align:middle;
float:left;
}
Created by GeSHI 1.0.7.20
Loggato
  • Aldo
  • user
  • *
  • Offline Offline
  • Posts: 80
  •  
  • Guarda Profilo
Re: Allineare verticalmente le immagini al testo
« Risposta #1 il: Maggio 25, 2008, 07:20:12 »

Se si vuole allineare un'immagine al testo in maniera tale che essa stia alla sinistra e che contemporaneamente il testo risulti all'altezza del centro dell'immagine bisogna disporre con float l'immagine a sinistra e con vertical-align stabilire l'allineamento dell'immagine stessa con il resto del documento. Potrebbe poi essere necessario evitare che in una parte del testo vengano allineate delle immagini a destra o a sinistra per farlo basta usare clear (left, right, both) per far sì che i lati vengano ripuliti dai float.  wink
Codice
GeSHi (html4strict):
<p>
<img src="pathimmagine/immagine.jpg" alt="la tua immagine" />
Testo allineato con la tua immagine
</p>
Created by GeSHI 1.0.7.20
     
Codice
GeSHi (css):
p img{
vertical-align:middle;
float:left;
}
Created by GeSHI 1.0.7.20

Buono a sapersi... funziona anche con altri tipi di "blocco" oltre che immagini, no?
Loggato

Astrac - www.astrac.org
  • skydiamond
  • Amministratore
  • pr
  • *
  • Offline Offline
  • Posts: 883
  • skydiamond 
  • Guarda Profilo WWW
Re: Allineare verticalmente le immagini al testo
« Risposta #2 il: Maggio 25, 2008, 07:25:02 »

Buono a sapersi... funziona anche con altri tipi di "blocco" oltre che immagini, no?
Dovrebbe, ma siamo sempre su un terreno minato per via dei float, dei position, dei clear, degli IE...  Firefox
Loggato
Pagine: [1]
You are here: Sky ForumWebSviluppo webCssAllineare verticalmente le immagini al testo
Salta a: