Centrera text med CSS?

Hmm

vertical-align funkar bara i två fall...

1. i tabellceller

2. mot "radhöjden" i inline-text.

3. kan du lösa t.ex. genom att köra med display:table-cell såhär:

<div style="display:table-cell;height:200px; vertical-align:middle">Foo</div>

.. men du kommer ganska snart att se att detta inte funkar i MSIE (såklart :x)

Så alternativ 2 är att ta till fulingen att meka med line-height t.ex. såhär:

<div style="line-height:200px; vertical-align:middle">Bar</div>

...Vilket är enkelt om man som i mitt exempel har *en* rad text men kräver eftertanke och minst en div eller span till om man skall ha radbrytningar med i spelet ;)

Men kan du tänka dig en div eller en span till så kan du t.ex. göra såhär:

<div style="line-height:200px; vertical-align:middle">
  <div style="line-height:1em">B<br>a<br>r</div>
</div>

om du behöver ha radbrytningar i det som centreras vertikalt enligt alternativ 2 ;)

Tack Jarvklo!
Den här gången hade jag faktiskt turen att det enbart rör sig om en enda text rad. :)