CSS Dropdown Menu - Hiding from <=IE6

[samanime]

Hello, on my page: http://www.aggis-topography.com/azureronin, I have a CSS dropdown menu. It works fine in FF and IE7, but acts up in IE6. I knew this would be the case, and is acceptable since the site is perfectly navigable without the drop-down.

Thus, I want to simply hide the drop-down section entirely from <=IE6, but I can't quite figure out how. I know I can use the * html trick to make only IE6/5.5 see the CSS, but I'm not sure what CSS to put.

The menu is structured as such:

<div id="menu">
<ul>
    <li><a>link</a>
    <dl>
        <dd>
             <ul>
                   <li><a>sublink</a></li>
             </ul>
         </dd>
     </dl>
     </li>
</ul>
</div>

And the CSS is:

#menu li > dl {
	display: none;
}

#menu li:hover > dl {
	display: block;
	position: absolute;
	border: 2px solid black;
	background-color: #348370;
	margin-top: 3px;
	z-index: 2;
}

#menu li:hover > dl li {
	float: none;
	margin-left: 3px;
	margin-right: 3px;
	width: auto;
	text-align: left;
	font-weight: 100;
}

Thanks.

[samanime]

Ah, I got it.

I simply added:

* html #menu li dd, * html #menu li dt {
	height: 0px;
	overflow: hidden;
}

after the other CSS. Hope that can help someone else.

I was trying to apply that to the dl, but IE didn't like that, so I had to apply it to the dt and dl.