Trouble with Horz Nav Bar in ie7 and 8

Hi,
I have a horz nav bar that works in FireFox, but not in ie7 and ie8.
(I got ie6 to work pretty well) I'm using conditional comments.

ie7
I have some gaps between the lists, and when I scroll over "our work"
I can only go 2 levels down, and then it disappears, so I can access those links.

ie8
has same problem with going beyond 2 levels and it disappears so you can't access those links.

Here are the urls:
http://www.artistic-impressions.com/nav/index-2.php
http://www.artistic-impressions.com/nav/css/ie7.css
http://www.artistic-impressions.com/nav/css/ie8.css

Any help would be greatly appreciated:)

You have some errors in your markup, get them fixed first, see http://validator.w3.org/check?uri=http%3A%2F%2Fwww.artistic-impressions.com%2Fnav%2Findex-2.php&charset=%28detect+automatically%29&doctype=Inline&group=0

Ok it all validates, it didn't have anything to do with the nav bar. I'm going to keep trying but I keep going in circles right now:)

Here are the urls:
http://www.artistic-impressions.com/nav/index-3.php
http://www.artistic-impressions.com/nav/css/ie7.css
http://www.artistic-impressions.com/nav/css/ie8.css

Any help would be greatly appreciated

Um.. your nesting of list items is not proper. I'd remove all those conditional comments and use the son of suckerfish drop down (http://www.htmldog.com/articles/suckerfish/dropdowns/)(check the proper nesting there) method

Hello aic,
Like ab says, your ul menu is not formed right.
The validator shows you the error - http://validator.w3.org/check?verbose=1&uri=http%3a%2f%2fwww.artistic-impressions.com%2fnav%2findex-2.php

So I tried to implement the suckerfish menu.

-So their menu has consistent widths and that doesn't work for this menu.
-I tried to add classes to get the widths different, but I could only get it to work for the top level.
-I don't seem to be able to get the red on the menu bar for most every browser but ie7 and ie6.
-I'm not sure how to get the links all on one line. so for example, donation center | is on two lines.
-Hey, but I got the drop downs to finally work, and I took out the conditional comments:)

-What about the issue of not having javascript enabled on all browsers?

Here are my urls:
http://www.artistic-impressions.com/nav/index-6.php
http://www.artistic-impressions.com/nav/css/Template-CHFe.css

I validated in both css and html.

Thanks in advance for your help:)

-I tried to add classes to get the widths different, but I could only get it to work for the top level.
You may set the required width specifically like
.ul-2 ul{
width:10em;
}
.ul-3 ul{
width:11em;
}
-I'm not sure how to get the links all on one line. so for example, donation center | is on two lines.
It's due to the widths applied at #nav a {/*Template-CHFe.css (line 76)*/
display:block;
font-family:arial,helvetica,sans-serif;
font-size:11px;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold;
line-height:16px;
width:7em;
} Try removing or changing it.

-What about the issue of not having javascript enabled on all browsers?
That code should work in all standard browsers like FF,Safar,Opera etc. The javascript fix is just for IE6.