CODEWITHSUNDEEP
htmlcssheightscreenscreen-resolution
Howdy_McGee
Howdy_McGee

Reputation: 10645

Simple HTML / CSS Questions - Height & Screen Resolution

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.

Upvotes: 0

Views: 2204

Answers (2)

Jason Gennaro
Jason Gennaro

Reputation: 34855

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

Upvotes: 3

Peter Kazazes
Peter Kazazes

Reputation: 3628

Giving the div 100% height and width will make it take up the entire of the window. 

#fullscreen {
height:100%;
width:100%;
}

Upvotes: 0

Related Questions