URGENT! help IE6 list navigation bug

[mediaman_12]

HELP!
I am just about to go live with some updates for an old job, but I have just realised that the new navigation has gone all screwy in IE6, It's fine in firefox, and IE7 but for some reason IE6 has duplicated some of the list items with just the backgrounds(??).
Can someone please have a look for me, thanks.

site: http://www.designed4hits.com/dev/gjseddon/
CSS:http://www.designed4hits.com/dev/gjseddon/main.css

The main page layout was done a few years back, and not by me. An extra section has been added, So I redid the navigation as a list (it was previously a row or images with rollovers). The problem possibly lies in that IE is in 'bugs' mode but as the rest of the sites code is such a mess, fixing that would be almost impossible.

UPDATE! it's not the list backgrounds, it's old background of the top div (it's how the nav was done before), what is happening is that the left margin to get the end of the list away from the logo is being doubled in IE6?
SOLVED: Did it with padding on the UL instead of margin. Thanks if you looked and tried to help

[markbrown4]

yeish..

The lists should be lists!
Use the arrow as a list style image and you be on your way to clean markup

[SoulScratch]

yeish..

The lists should be lists!
Use the arrow as a list style image and you be on your way to clean markup

[stolen from dan cederholm]
It's better to use background image, because of the inconsistency with padding using list-style-image.

ul li { background: url("images/arrow.gif") no-repeat 0 50%; padding-left: (arrow.gif's width); }

[mediaman_12]

I am aware of miriod of other layout, HTML & CSS 'issues' there are with the site, the first being that it's all done in tables. The site was completed a few years ago now, and there was talk of a redesign in the near future.