View Single Post
  #12 (permalink)  
Old Dec 6th, 2007, 13:03
HitByLife HitByLife is offline
Junior Member
Join Date: Jan 2006
Location: Spain (Malaga)
Posts: 39
Thanks: 0
Thanked 0 Times in 0 Posts
Re: CSS menu not working in IE6

Just an update:

I haven't been able to solve this altogether, but at least I've managed to make the page load in IE6 - and I'm now completly forgetting about IE5.5, even though this menu should in principle work for that browser as well. Not all items in the menu are visible yet, but I'm working on it.

The problem seems to have been, partially at least, inconsistent use of conditionals. In order to make the dropdown/flyouts work, the author of the original css code used conditionals for the IE browsers:

HTML: Select all
<li><a href="#"><!--[if IE 7]><!-->LINK</a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
Now, IE7 (and all other more or less standards compliant browsers) should close the <a> tag as expected, but when it comes to IE6 (and supposedly IE5.5) the browser must be fooled into thinking the <a> tag is closed much later, in fact after your entire list:

HTML: Select all
<li><a href="#"><!--[if IE 7]><!-->LINK</a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
  <ul>
     <li><a href="#">sublink 1</a></li>
     <li><a href="#">sublink 2</a></li>
  </ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
What this should do, is to let IE6 create a table and have the <ul> flow down into it. The reason is that IE5.x and IE6 do not understand li:hover, so the unordered list has to be nested in a table.

This is a bit complicated and I would probably have been much better off with a simpler way of creating these menus, using javascript and dhtml. But, it s a pure css menu and it should validate..
Reply With Quote