Blog

CSS level 2 does not have a property for centering things vertically. There will probably be one in CSS level 3. However, you can center block vertically in CSS2 by combining a few properties. The trick is to specify the outer block as a table cell, because table cell contents can be centered vertically.

Note: Not all e-reader devices may display these CSS properties.

The following example centers a paragraph inside a block with a certain height.

Here is an example:

CSS

div.container {
   min-height: 10em;
   display: table-cell;
   vertical-align: middle;
}

HTML

<div class="container">
<p>This small paragraph...
</div>