News categories
AdSense
Create a div 100% of page height in IE, FF, Opera & Safari
Posted by webmaster on 2007-12-31 03:49:52 in Web Resources: DesignWhilst designing sites for an Art Gallery in Crieff(external link) and an Architect in Comrie, Perthshire(external link) I needed to have div's that spanned 100% of the height of the page.
The following was the most elegant solution, it works in FF1+, IE6+ (although a little buggy on Mac), Opera and Safari. First, include the following in your CSS file:
html,body {
height: 100%;
padding:0px;
margin:0px;
}
Then, apply the CSS attribute height:100%; to the required div. Unless the target is within an element with an overriding height attribute it will expand to the full height of the page. See the two links above for a demonstration.
Permalink: http://www.stom66.co.uk/news/17/60/Create-a-div-100-of-page-height-in-IE-FF-Opera-Safari.html








