CSS Menu help

hello all..
i am seeking help with a CSS Menu that is working when viewed in Firefox but not in IE (6-8). If you would like a link to the actual site, please let me kno, and many thanks in advance ^_^

This is the CSS Menu code
ul#cssMenu ul{display:none;}
ul#cssMenu li:hover>*{display:block}
ul#cssMenu li:hover{position:relative;}
ul#cssMenu ul{
position: absolute;left:-1px;top:98%;opacity:0.8;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";}
ul#cssMenu ul ul{
position: absolute;left:98%;top:-2px;opacity:1;}
ul#cssMenu,ul#cssMenu ul{
margin:0px;list-style:none;padding:3px 0 3px 3px;background-color:transparent;background-image:url(http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822128.jpg);background-repeat:repeat;border-width:1px;border-style:solid;border-color:#1d1d1d;}
ul#cssMenu table {border-collapse:collapse}
ul#cssMenu {
display:block;font-size:0;zoom:1;float: left;}
ul#cssMenu ul{
//width:143px;padding:3px 3px 0;}
ul#cssMenu li{
display:block;zoom:1;margin:0;font-size:0;float:left;}
ul#cssMenu a:active, ul#cssMenu a:focus {outline-style:none}

ul#cssMenu a{
display:block;vertical-align:middle;_display:inline-block;_vertical-align:top;background-color:#1d1d1d;background-image:url(http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822128.jpg);border-width:0px;border-style:solid;border-color:#1d1d1d;text-align:left;text-decoration:none;padding:4px;_padding-left:0;font:normal 10px Verdana;color: #666666;text-decoration:none;cursor:pointer;}
ul#cssMenu ul li {float:none;}
ul#cssMenu ul a{
display:block;text-align:left;white-space:nowrap;}
ul#cssMenu li:hover>a{
background-image:url(http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822128.jpg);border-color:#1d1d1d;border-style:solid;font:normal 10px Verdana;color: #996666;text-decoration:none;}
ul#cssMenu li a:hover{
_position:relative;background-image:url(http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822128.jpg);border-color:#1d1d1d;border-style:solid;font:normal 10px Verdana;color: #996666;text-decoration:none;}
ul#cssMenu img{
border: none;vertical-align: middle;margin-right:8px;}
ul#cssMenu img.over{display:none}
ul#cssMenu li:hover > a img.def {display:none}
ul#cssMenu li:hover > a img.over {display:inline}
ul#cssMenu a:hover img.over,ul#cssMenu a:hover ul img.def,ul#cssMenu a:hover a:hover img.over{display:inline}
ul#cssMenu a:hover img.def,ul#cssMenu a:hover ul img.over,ul#cssMenu a:hover a:hover img.def{display:none}
ul#cssMenu a:hover ul{display:block}
ul#cssMenu a:hover ul{display:block}
ul#cssMenu span{
display:block;overflow:visible;background-image:url(http://darktf.b1.jcink.com/uploads/darktf//post-11-1267824055.gif);background-position:right center;background-repeat: no-repeat;padding-right:14px;}

the navigation portion is as follows:
<ul id="cssMenu">
<li><a href="http://darktf.b1.jcink.com/"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Home</a></li>
<li><a href="http://#">
<span><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">DTF ID</span>
<![if gt IE 6]></a><![endif]>
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul style="width:116px;">
<li><a href="http://darktf.b1.jcink.com/index.php?act=Login&CODE=00"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Log in</a></li>
<li><a href="http://darktf.b1.jcink.com/index.php?act=Login&CODE=03"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Log out</a></li>
<li><a href="http://darktf.b1.jcink.com/index.php?act=Reg&CODE=00"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Register</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!--[if lte IE 6]><table><tr><td><![endif]-->
<li><a href="http://pax.darkfx.com/"><span><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">i|Pax</span>
<![if gt IE 6]></a><![endif]>
<ul style="width:135px;">
<li><a href="http://pax.darkfx.com/"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">World Index</a></li>
<li><a href="http://darktf.b1.jcink.com/index.php?act=store"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Pax Bazar</a></li>
<li><a href="http://darktf.b1.jcink.com/index.php?act=Arcade"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">[iA]rcade</a></li>
<li><a href="http://darktf.b1.jcink.com/index.php?act=army"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Army HQ</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="http://darktf.b1.jcink.com/index.php?act=UserCP&CODE=00" target="_blank"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Controls</a></li>
<li><a href="http://darktf.b1.jcink.com/index.php?act=Msg&CODE=01"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Messages</a></li>
<li><a href="http://darktf.b1.jcink.com/index.php?act=Search&f="><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Search</a></li>
<li><a href="http://darktf.b1.jcink.com/index.php?act=calendar="><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Calendar</a></li>
<li><a href="http://pax.darkfx.com/links.html"><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">Conextions</a></li>
</ul>

from first glance it seems you repeat yourself alot in your css, or else the organization just seems repetitive. I would atleast suggest cleaning it up so you can follow whats doing what for what to narrow down your possibilities for where the bug may be. If the menu is somewhat consistent you shouldnt need so many different classes of ul and li

i would set up the css in a basic format as below:



#div { };
#div ul { };
#div ul li { };
#div ul li a{ };
#div ul li a:hover{ };



might not solve your problem, but may lead you to find something obvious.


other than that, if you give me a link, maybe ill be able to wrap my head around it some more

i edited the code, it looks to have cleaned it up.
everything tested fine in the HTML editor (i am using CoffeeCup)
but when adding to the site.. still not working in IE

it may be the tables your inserting in there if its ie. i dont know of a circumstance where that would be necessary. ie should display lists correctly.

id just try boiling it down and then work your way back up to see where you start to get errors.

it may be somewhere in there where you have lists inside of lists

The code you posted works fine for me in IE7. If it doesn't work for you I wonder if you have a valid correct doctype (http://www.alistapart.com/articles/doctype/) on your page. Without one IE is unlikely to behave itself.

Not quite right in IE6 still. Some of your conditional comments are not correctly formatted:

<![if gt IE 6]></a><![endif]>

should be:

<!--[if gt IE 6]></a><![endif]-->

And this segment of your markup:

<!--[if lte IE 6]><table><tr><td><![endif]-->
<li><a href="http://pax.darkfx.com/"><span><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">i|Pax</span>
<!--[if gt IE 6]></a><![endif]-->


should be:

<li><a href="http://pax.darkfx.com/"><span><img class="def" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267822766.gif"/><img class="over" src="http://darktf.b1.jcink.com/uploads/darktf//post-11-1267823893.gif">i|Pax</span>
<!--[if gt IE 6]></a><![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->

o wow.. the doc type.. go figure.
that seemed to do the trick. Thank you.