CSS can't seem to set height to 100% of parent container
I'm wondering why the heig开发者_开发技巧ht: 100% on the li's in this does not set the height to the ul they're a child of.
http://homecoming.umd.edu/index2.html
?_?
You need to set an explicit non-percentage height on a parent element. You currently have height:100% on your <ul>, too, which you'll notice isn't doing anything. If it were working, your navigation would expand your whole page, because its parent is your wrapper div that contains a bunch of other stuff. However, if you set your <ul> to something like height:40px, the <li> will follow suit.
height:100% depends on an explicit height set somewhere in a parent element. If no height is ever set with anything other than percentages (or if every parent element all the way up to <body> and <html> doesn't have height:100% set), then it will never actually do anything, because it has no reference height to start from.
I'm not sure what other people are getting, but using FF4 with Firebug I can see that there is no height: 100%; for the li's. There is for the ul however and that seems to be working fine.
Maybe trying putting height: 100%; in your css file for #nav li. Also, there's a padding in there that may throw you off in the future. Be sure to look into that if it's giving you problems.
EDIT: This is what I'm seeing in Firebug for the #nav li:
#nav li {
float: left;
position: relative;
width: 9.09%;
}No mention of the height attribute.
This would fix it (it won't fix the overlap in 'Greek organizations' though)
#nav { height: 44px; }
#nav a { height: 30px; }
I was kinda hoping the height would be explicitly set by the height of the container. Like, in the event we ever needed a 100 word title for some godforsaken reason, it'd automatically do it.
If I'm understanding this correctly and this is the real reason you are asking this question, just set #nav to "height:auto;" and, if you want it to be at least a certain height use something like "min-height:44px;"
Height of 100% in CSS can be tricky sometimes, as it depends on the size of the parent containers. Here are some similar questions/answers that might help.
加载中,请稍侯......
精彩评论