Currently facing an issue with a page I am working on.
Here is a snippet of the code:
<div id="header"> // header..
</div>
<div id="content"> // content where ajax is loaded (should cover at least 100% of the site height)
<!-- ajax -->
</div>
<div id="footer"> //empty currently.
</div>
Now onto the CSS:
#content{
margin-left:auto;
margin-right:auto;
background-color:#767670;
width:800px;
border-left:1px solid #9F9793;
border-right:1px solid #9F9793;
position:relative;
height:auto !important; /* for modern browsers */
height:100%; /* IE6: treated as min-height*/
min-height:100%; /* modern browsers */
}
#footer{
width:100%;
height:40px;
border-top:1px solid #9F9793;
border-bottom:1px solid #9F9793;
background-color:#767670;
}
Seeking help in making the container span from the header to the footer. Have tried implementing various solutions with no success. Any assistance would be greatly appreciated!