homepage Welcome to WebmasterWorld Guest from 54.235.61.62
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderator: open

CSS Forum

    
100% page height NOT window height
optik




msg:4278778
 11:53 am on Mar 9, 2011 (gmt 0)

Whenever I try to set a div to be 100% page height it always ends up using the window height what is the solution for this.

Thanks

 

webprutser




msg:4279090
 8:25 pm on Mar 9, 2011 (gmt 0)

How about using a value in pixels instead of %?

optik




msg:4279125
 9:16 pm on Mar 9, 2011 (gmt 0)

because the page height varies

webprutser




msg:4279265
 1:23 am on Mar 10, 2011 (gmt 0)

All right. I think this thread might be the answer to your question:
[webmasterworld.com...]

webprutser




msg:4279270
 1:27 am on Mar 10, 2011 (gmt 0)

P.S. (it's a pity I can't edit my post, I often think of something in addition once I've posted) it's an old thread, but SuzyUK is still on this forum, so if you still have questions, help is not far away.

swa66




msg:4288030
 2:40 am on Mar 27, 2011 (gmt 0)

Can't say I fully understand the problem, but I think it's a matter of using min-height in a strategic spot.

The library entry [webmasterworld.com...] might have what you seek in a more elaborate fashion.

100% height is simple:
- the root has the window height as height
- any element you set to 100% height takes the height of it's DIRECT parent provided the element had an explicitly set height different from "auto" (which is the default).

So seek the outermost element that stretches with your content, give it min-height: 100% (it will be the largest of the content and the window height), then give all parents up to and including html height: 100% (they will be as high as the window in order to pass the size of the window down to the element that's stretching larger as needed.

When I do this, I like to make the stretching element far on the outside as those short elements that scroll away can be a pain to deal with.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved