Vertical Alignment

Question

Please take a look at this: http://sources.freehosting.bg/landing.html

I am trying to vertically align #content so it looks good on larger (1920x1200) and smaller (1

Answer 1

See if this fiddle is what you are looking for. Simple solution IMO.

It works by forcing the containing div to behave as a table-cell, and making use of the vertical-align: middle style. It doesn't require you to know the heights of any elements at all.

Code used in the fiddle are below.

HTML:

    text inside div a
    

        text inside div b
    

The important styles are:

display: table-cell 
vertical-align: middle

The rest are only there for demonstration. CSS:

div.a {
    border: 1px solid red;
}
div.b {
    border: 1px solid blue;
    height: 200px;
    display:table-cell;
    vertical-align:middle;
}