Reputation: 322
I'm redesigning my website, and at the moment I'm just blacking out the layout. I have a class that centres everything:
.centre
{
position:absolute;
left:50%;
top:50%;
}
everything is then offset using a margin.
I have a wrapper that gives the min-height and min-width
#wrapper {
position:relative;
left:0px;
top:0px;
min-height:600px;
min-width:600px;
}
The min-width and min-height both do their job but for some reason after this wrapper is applied the website is no longer centered vertically.
You can see the website here: http://testerwebby.tumblr.com/
I'm wondering what's the cause of this, and what's the solution.
Thanks,
Dillon Brannick.
Upvotes: 1
Views: 3431
Reputation: 12087
Your problem is that your page's body does not fill the whole browser window vertically. You can check this by using Firebug and hovering your body element - not the whole browser window will get a blue hue.
Try to fix this with the following CSS:
html, body
{
height: 100%;
}
Upvotes: 1