Question

I need to make a div have a certain height, it has a repeating image in it and I want it to take up the entire screen no matter what the users screen resolution is. Height auto depends on the content so do I need to use javascript in order to achieve my goal? Or can I use something with a “clear:both;” property on it in order to always stretch the div to the bottom? I would really like to avoid javascript.

Answer 1

As long as the parent container (like body or html) has 100% height, then the div should also. So

html, body{
    height:100%;
}
div{
    height:100%;
    width:100%;
    border:1px solid red;
}

Example: http://jsfiddle.net/jasongennaro/Jm8Mt/

Of course, your div would have a class… example was just for show