[B]What would be a work-around for the ignored “min-height” property in IE6?
All I want to do is to make the ‘footer’ DIV stay at the bottom of the pages across my website in the situations, where there’s not enough content in the ‘content’ DIV in order to “push” the ‘footer’-DIV down.
html,body {
height : 100%;
}
div.container {
height:100%;
width: 85%;
margin: 0 auto;
}
div.mainContent {
width:100%;
[COLOR=”Red”]height:70% /*Calculated height, so that the footer stays visible without scrolling down. This is where the problem lies.
margin-top:20px;
}
div.footer {
width:60%;
margin:auto;
margin-top:20px; /* separates the footer from the main content
text-align:justify;
font-family:Arial;
font-size:10px;
}
[code=html]
<div class=”container” >
<div class=”mainContent”> … bla-bla…. </div>
<div class=”footer”>…. disclaimer …. </div>
</div> <!– End of Container–>
[U]I could have used height:70% for the content div — that way the footer would stay visible without scrolling down[B]I have collapsable DIVs on the page, so when I open those DIVs, they overflow the footer, covering it! And that is because the footer does not get pushed down by the ‘content’ DIV!
Please help solve this.
Thank you.