English-only | Jenom česky | Bilingual/Dvojjazyčně

CSS Hack: Svislé centrování jednořádkového textu

Máme-li blok dané výšky, jednořádkový text v něm snadno svisle vycentrujeme tak, že textu nastavíme vlastnost line-height na stejnou hodnotu, jako je výška bloku. Výšky však musí být zadány relativně k velikosti písma (např. pomocí jednotky em).

   #block {
      ...
      height: 5em;
      line-height: 5em;
      ...
      }
Lorem ipsum

Nápad pochází z článku Ten CSS tricks you may not know na evolt.org.