vertical-align

Vertical-Align text inside a DIV container with CSS

Text-Align, the simple case

Aligning text in a DIV container ist very simple done by the following code:

  <div style="width:100%; text-align:center;">Centered Text</div>

Vertical-Align - the complicated case

Vertical alignment of text in a DIV is a little bit more complicated, because the usual way used for table cells doesn't work with DIVs.

The code below doesn't work:

  <div style="height:3em; vertical-align:middle;">
    Not centered vertically!
  </div>