...

View Full Version : Div with Background color won't wrap nested ul's



cober
10-23-2007, 05:10 PM
I have a left side nav within a div that is:

<div>
<ul>
<li></li>
<li></li>
<li>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
</div>
I can't seem to get the div to match the actual height of the list which give me a background colour problem and the following div's overlap the list.

The current result is visible here: http://www.pwct.cober.ca/content.html

Any insight into this seemingly simply layout would be appreciated.

Thanks.

abduraooft
10-23-2007, 05:15 PM
Please specify the exact location of these tags?

cober
10-23-2007, 05:46 PM
Thanks for the quick reply.
Is this what you are requesting?

<div id="wrap">
<div id="left-column">
<div class="bluff">
<ul>
<li></li>
<li></li>
<li>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
</ul>
</div>
</div>
</div>

_Aerospace_Eng_
10-23-2007, 05:55 PM
Get rid of the height here

.bluff li {
margin:0;
height:25px;
}

abduraooft
10-23-2007, 05:56 PM
You have some errors in closing some of you tags.
Fix validation-errors (http://validator.w3.org/check?uri=http%3A%2F%2Fwww.pwct.cober.ca%2Fcontent.html&charset=%28detect+automatically%29&doctype=Inline&group=0),
and then try.
Edit: Aero beat me, but you should fix the errors.

cober
10-23-2007, 09:22 PM
Thanks to you both, I appreciate the helpful & quick response.

That has definitely resolved the layout issue in all browsers. The reason I had used the height tag was to reign in IE6. The problem still exists, the line height in IE6 is about double that of Firefox & IE7.

Any further help would be great.

_Aerospace_Eng_
10-23-2007, 11:15 PM
Add this to your stylesheet

/*hide from IE Mac\*/
* html .bluff li, * html .bluff li a {
height:1%;
}
/*end hide*/
That will target IE 6 and below for PC.

harbingerOTV
10-24-2007, 02:04 AM
<!--[if lt IE 7]>
<style type="text/css" media="screen">
.bluff li, .bluff li a {
height:1%;
}
</style>
<![endif]-->


but conditional comments would be better IMO.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum