Some notes: no "margin x" commands can be used on the vertical axis as I understand it as it pushes the position of the following <div's> down so you end up with a scrollbar.
-----CSS-----
* {
margin: 0px;
}
html, body {
height: 100% ;
}
.mainwapper {
min-height: 100%;
height: auto ;
height: 100%; /*These two set the containing div to the height of the browser window. All displayed div's are contained within.*/
margin: 0 auto -2em; /*the 2em is height reserved for the footer. The footer is indented by this much to make it sit at the bottom of the page.*/
}
.footer, .push {
height: 2em;
}
-----HTML-----
Div structure would be:
<html>
<head></head>
<body>
<div id="mainwrapper">
<div id="push"></div>
</div>
<div ="footer">
</div>
</body>
</html>
Silly me - after writing this I now see where I went wrong setting mine up. Push is a div, hopefully when I tackle this again tomorrow I will get it working as expected. Im not much of a planner at the moment...
No comments:
Post a Comment