the following code works fine without giving the doc type why its happening , any solution to solve this issue.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html>
<head>
<style>

 #container {  
 border:10px solid blue;
     position:relative;  

     min-height:100%;  
      _height:100%; 

 }  

 #content {  

   border:10px solid green;

 }      

 #footer {  
 border:10px solid red;
      position: relative;  
      height:100px;  


 } 
</style>

</head>
<body>
<div id="container">      

</div>
 <div id="footer">  
     content for footer  
 </div> 

</body>
</html>

1 answer

1
point

Try setting body to 100% height as well, and then you'll need to move the footer back up over the bottom of the container (so add bottom padding to it)

or, better than that use this method: http://www.cssstickyfooter.com/

Answered almost 9 years ago by Tony Crockford