CSS Vertical Centering Made Easy


In CSS Level 2, you won't find the vertical centering property . What to do.
But even in CSS2, you can center boxes vertically by combining a few properties. The trick is to specify that the outer box should be formatted like a table cell, because the contents of the cell should be centered vertically.

The example below shows a block element in which the paragraph lies, naturally we replace the block element with a table cell , and sets the vertical centering (middle) - display: table-cell; vertical-align: middle;

*div class="container"
style="height: 300px;
margin:0 auto;
vertical-align: middle;
border:1px dashed #999;
*p>Here is a small paragraph centered vertically</p*

Here is a small paragraph that is centered vertically in a box with a border. And even lower Bonus.


Bonus from me: - nice music

Last in our blog

Internet Marketing