Html Breakout Menu Giving Me Problems In Ie8

[bigsilk]

I have a two-stage breakout menu - first is an option that says, "What may we show you today?", and on mouseover, it breaks out to a four-item menu. Mouseover a menu item and each of those four menu items have more options. It works fine in Opera, FF, Safari and Chrome... Just not in the most popular browser in the known universe.What it shows is this. (View in IE, then in another browser.)Here's some code:

<div class="mainmenu"><ul> <li class="li_hc"> <a href="/" target="_self" >What may we show you today? » </a> <ul class="ul_ch"> </li> <li class="li_hc"> <a href="#">Color themes? » </a> <ul class="ul_ch"> <li class="li_hc"><a href="#" >Red </a></li> <li class="li_hc"><a href="#" >Blue </a></li> <li class="li_hc"><a href="#" >Green </a></li> <li class="li_hc"><a href="#" >Yellow </a></li> </ul> </li> <li class="li_hc"> <a href="#" target="_self" >Orientation? » </a> <ul class="ul_ch"> <li class="li_hc"><a href="#" >Portrait (Taller than wide) </a></li> <li class="li_hc"><a href="#" >Landscape (Wider than tall) </a></li> </ul> </li> <li class="li_hc"> <a href="#" target="_self" >Sizes? » </a> <ul class="ul_ch"> <li class="li_hc"><a href="#" >Small </a></li> <li class="li_hc"><a href="#" >Medium </a></li> <li class="li_hc"><a href="#" >Large </a></li> <li class="li_hc"><a href="#" >Custom </a></li> </ul> </li> <li class="li_hc"> <a href="#" target="_self" >Subject matter? » </a> <ul class="ul_ch"> <li class="li_hc"><a href="#" >Human </a></li> <li class="li_hc"><a href="#" >Animal </a></li> <li class="li_hc"><a href="#" >Urban </a></li> <li class="li_hc"><a href="#" >Natural </a></li> </ul> </li></ul></div>

Oh, and disregard layout in iframe. Still working on that...Some of you who have helped me on this project may recognize the page.

[Ingolme]

You have mismatching tags here

<ul><!-- Open UL1 --><li class="li_hc"><!-- Open LI1 --><a href="/" target="_self" >What may we show you today? » </a><ul class="ul_ch"><!-- Open UL2 --></li><!-- Close LI1 --><li class="li_hc"><!-- Open LI2 --><a href="#">Color themes? » </a><ul class="ul_ch"><!-- Open UL3 -->

It's no wonder that the browser is confused as to what to do.