Sent by Zoe M. Gillenwater on 26 January 2007 19:07
Grady Kelly wrote:
> I am building a UI for a web application. I am using 100% heights for a lot
> of the outer elements, like this:
>
> <wrapper> - this has 100% height
> <div1> - this has 100% height</div1>
> <div2> - this has 100% height</div2>
> <div3> - this has 100% height</div3>
> </wrapper>
>
> this works all fine and dandy. the problem that I am having however, is
> with divs inside div1, div2 and div3. When I give these divs 100% height,
> they end up being 100% the height of the browser window, not the containing
> div. When viewed in a browser, I end up with a certain number of pixels
> whitespace at the bottom of the page. That make sense? Is there a way to
> give divs 100% height of their parent?
>
That's what they are doing. Their parents have a height equivalent to
the browser viewport because *their* parents (wrapper, and then body,
and then html) have a height equivalent to the browser viewport because
that's what 100% equals when there's no parent with a height other than
"viewport" set. They each fill up their parent, and you haven't told any
of them to *not* be the height of the viewport. We'll need to see a page
to figure out what height you really want and help you set it.
Zoe
--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
