allineare un elemento

Può capitare di dover allineare ad esempio immagini e testo su una medesima linea. La proprietà css da usare è vertical-align, che può essere settata su vari valori: baseline, sub, super, top, text-top, middle, bottom, text-bottom, length, or a value in percentage

modalità immediata: allineare un'immagine in un box

In questi tre esempi agiamo non sullo stile dell'immagine, ma su quello del box.

vertical-align: top

icona Blogger

vertical-align: middle

icona Blogger

vertical-align: bottom

icona Blogger

allineare immagine e testo

Prendiamo questo esempio, senza specificazioni:

Seguici su icona Blogger

Adesso modifichiamo lo stile dell'immagine:

vertical-align: top

Seguici su icona Blogger

vertical-align: bottom

Seguici su icona Blogger

vertical-align: middle

Seguici su icona Blogger

vertical-align: super

Seguici su icona Blogger

vertical-align: sub

Seguici su icona Blogger

vertical-align: text-top

Seguici su icona Blogger

vertical-align: text-bottom

Seguici su icona Blogger

vertical-align: baseline

Seguici su icona Blogger

Si vede che la modalità di default è appunto baseline.

Si può utilmente vedere: su css-tricks e su flep studio