Need help with a IE6 issue

Hi,

I've got a menu that is not displaying correctly in IE 6 (no surprise). If it was anything like, I would be ok but it's pretty bad and I can't figure out how to fix it.

I made up a clean version here and the directories are browseable:
menutest.html

I used a CSS sculptor 2 col fixed left sidebar header and footer with added navigation div

I edited the header element to remove the padding and bottom border, ditto the navigation element

I also had to add height of 36px to navigation element properties otherwise the sidebar floated to the right of the menu.

Everything else is default.

I want the spacing on the menu items to be auto - it looks odd with the fixed 160 px width of the default menu writer layout when the amount of characters of individual menu items varies.

Did I screw up with the menu editing and is there a better way to achieve my design.

thx

-paul

Hi Paul,

I have had experience fixing a couple of similar issues in the past... can you post the IE6 menu css code (from the file found in the conditional IE6 statement). I will take a look and make a few suggestions.

Best regards,

Brian

Hi Brian,

You should be able to browse to any of the files in this sample site to check the code.

The menu is using the default CSSMenuWriter/cssmw/menu_ie.css css file for IE6

It's located here:
cssmw/

thanks

-paul

Brian,

BTW, the menu works in IE 6 with the default vista theme. The only edit you need to make to bust it in IE 6 is to change the width in edit theme/box/main/item/dimension/width from 160px to auto

I guess a horrible workaround could be to make 2 separate instances of this menu and use the ie6 css style generated from the default theme as the conditional and use the auto width css for everything other than IE6. Sounds like a hassle.

-paul

IE 6 and IE 7 will not work properly with widths set to auto. If you chose to use auto widths, you will need to use conditional CSS to set a pixel measurement for IE 6 and 7:

<!--[if IE 7]>
<style type="text/css" media="all">
ul#cssmw > li > span > a {
width: 100px;
}
</style>
<![endif]-->

<!--[if IE 6]>
<style type="text/css" media="all">
ul#cssmw li span a {
width: 100px;
}
</style>
<![endif]-->

thanks Jason,

The problem only showed up in IE6 for me. 7 was fine

-paul