Setting a DIV to 100% height
I'm setting a DIV to 100% height as shown in this example: http://www.dave-woods.co.uk/wp-content/uploads/2008/01/full-height-updated.html, but the problem is that the <body>
tag background color does not work if the page has scrolling.
Has anyone achieved 100% height div tags successfully, or can you tell me what this tutorial is missing?
html,
body {
height: 100%;
}
* html #content {
height: 100%;
}
body {
background: none repeat scroll 0 0 #2F404A;
color: #505050;
font-family: Arial,Helvetica,sans-serif;
font-size: 1开发者_StackOverflow2px;
line-height: 20px;
min-height: 100%;
}
The dark area is the tag, whereas you can see the content is extending beyond the body tag.
Screenshot: http://img833.imageshack.us/i/screenshotxh.png/
try it like this
html,
body {
height: 100%;
}
body {
background: none repeat scroll 0 0 #2F404A;
color: #505050;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
line-height: 20px;
min-height: 100%;
}
* html #content {
height: 100%;
}
精彩评论