I can't figure out while but IE6 will not seem to render the background on my dropdown menus.

Can anyone see why? Here is the site.

HTML:

<ul id="mainlevel-navmenu"> 
<li class="first"> <a href="/index.php?option=com_wrapper&amp;view=wrapper&amp;Itemid=27"><span>Our Listings</span></a>
	<ul id="mainlevel-navmenu"> <li class="first"> <a href="/index.php?option=com_wrapper&amp;view=wrapper&amp;Itemid=35"><span>IMR Listings</span></a> </li>
		<li class="last"> <a href="/index.php?option=com_wrapper&amp;view=wrapper&amp;Itemid=36"><span>So Cal Listings</span></a> </li>
	</ul>
 <div class="clrboth"></div>
 </li>

<li> <a href="#"><span>Area Listings</span></a>
	<ul id="mainlevel-navmenu"> 
		<li class="first"> <a href="/index.php?option=com_wrapper&amp;view=wrapper&amp;Itemid=34"><span>MLS Listings</span></a> </li>

		<li> <a href="/index.php?option=com_wrapper&amp;view=wrapper&amp;Itemid=32"><span>Bank Owned Properties</span></a> </li>
		<li class="last"> <a href="/index.php?option=com_wrapper&amp;view=wrapper&amp;Itemid=33"><span>Pre-forclosure Listings</span></a> </li>
	</ul>
	<div class="clrboth"></div> 
 </li>

<li> <a href="/"><span>Service Area</span></a>
	<ul id="mainlevel-navmenu"> 
		<li class="first"> <a href="/index.php?option=com_content&amp;view=article&amp;id=5&amp;Itemid=21"><span>Orange County</span></a> </li>
		<li class="last"> <a href="/index.php?option=com_content&amp;view=article&amp;id=4&amp;Itemid=22"><span>Riverside</span></a> </li>
	 </ul>
	<div class="clrboth"></div> 
</li>

<li class="last"> <a href="#"><span>About Us</span></a>
	<ul id="mainlevel-navmenu"> 
		<li class="first"> <a href="/index.php?option=com_content&amp;view=article&amp;id=6&amp;Itemid=23"><span>REO Experience</span></a> </li>
		<li class="last"> <a href="/index.php?option=com_contact&amp;view=category&amp;catid=0&amp;Itemid=25"><span>Office Contacts</span></a> </li>
	</ul>
	 <div class="clrboth"></div> </li>
 </ul>
 <div class="clrboth"></div>

CSS:

/****************************************************************/
/*************    NAV MENU    ***********************************/
/****************************************************************/
.moduletable-navmenu {
   background: transparent url(../images/bg-navmenu.gif) repeat-x left top;
   height: 30px;
   margin-bottom: .8em;
}

ul#mainlevel-navmenu {
   width: 100%;
   margin: 0;
   padding: 0;
   list-style: none inside none;
}

ul#mainlevel-navmenu li {
   float: left;
   margin: 0;
   padding: 0;
   width: 19.9%;
   line-height: 30px;
   font-size: 1.2em;
}

ul#mainlevel-navmenu li a {
   display: block;
   width: 100%;
   font-weight: bold;
   text-decoration: none;
   text-transform: uppercase;
   color: white;
}

ul#mainlevel-navmenu li:hover a {
   color: #ccc;
}

ul#mainlevel-navmenu li a span {
   margin-left: 30px;
}

/* drop down menu */
ul#mainlevel-navmenu ul {
   display: none;
   position: absolute;
   width: 200px;
   background-color: #000000;
   z-index: 10;
}

ul#mainlevel-navmenu li:hover ul {
   display: block;
}

ul#mainlevel-navmenu ul li {
   display: block;
   width: 196px;
   line-height: 1.3em;
   font-size: 1em;
   border-left: 2px solid #d51b1b;  /* red */
   border-right: 2px solid #d51b1b;  /* red */
}

ul#mainlevel-navmenu li li.last {
   border-bottom: 2px solid #d51b1b;  /* red */
}

ul#mainlevel-navmenu li:hover li a {
   background-image: none;
   color: white;
   font-size: 1em;
   font-weight: normal;
   text-transform: none;
}

ul#mainlevel-navmenu li li:hover a {
   color: black;
   background: #d6d7da;  /* light grey */
}

ul#mainlevel-navmenu ul li a span {
   margin-left: 10px;
}

It's probably just a "has layout" issue.

Try:
CSS

ul#mainlevel-navmenu ul {
zoom: 1;
}

[QUOTE=wayfarer07;846368]It's probably just a "has layout" issue.

I don't know what you mean by that.

I'm not really sure what I mean by that either, because it doesn't make much sense. "has layout" is a proprietary internal property that the IE team invented, that is not enabled by default, but must be enabled to allow an element to take on normal properties, such as backgrounds. They invented this to stop memory problems from happening, instead of optimizing their code, because they're a bunch of lazy pricks.

There are lots of things you can do to make an element have layout, such has setting a height on it, or using the proprietary Microsoft {zoom:} property. zoom: 1 means normal proportions.