vertical-align - ustala pionowe położenie elementu. Działa w elemencie typu inline lub komórce tabeli.
Aby wyśrodkować bloki w pionie, należy skorzystać z właściwości Line-height lub potraktować je jako table - zmieniając ich Display na table oraz table-cell. Wtedy zadziała na nich właściwość vertical-align.
Możliwe wartości:
- baseline (domyślna)
- middle - pionowe wyśrodkowanie elementu
- top - wyrównanie do góry elementu
- bottom - wyrównanie do dołu elementu
- text-top - wyrównanie do górnej granicy tekstu
- text-bottom - wyrównanie do dolnej granicy tekstu
- super - umieszczenie elementu nad tekstem (indeks górny)
- sub - umieszczenie elementu pod tekstem (indeks dolny)
- jednostki miary
- Inherit
Przykład użycia:
<p><img src="http://4programmers.net/bin/coyote.jpg" width="57" height="90" alt="coyote" style="vertical-align: top">top<p>
top
```css
middle
```
middle
```css
bottom
```
bottom
```css
tekst 20px tekst
```
tekst 20px tekst
```css
Tekst super tekst
```Tekst super tekst
```cssTekst sub tekst
```Tekst sub tekst