IE moved my menu!

[shockeye]

The site is in standards-complient XHTML and CSS, something IE6 has a huge beef with. But I've never seen IE do this before... can't seem to find any meaty info on the net, so I offer it up to Dani Web... how the heck to I fix this? Here are some screenshots. First Firefox, because it looks how it is supposed to:

http://www.amadon.us/hotlinks/search_menu_small_firefox.png

... and IE6,

http://www.amadon.us/hotlinks/search_menu_small_IE6.png

If it comes to a fix that only works in IE, but breaks FF or other browsers, it's fine, I have an IE specific stylesheet.

I blurred out the logo because the site isn't launched yet and I'm not sure if the client would permit it.

Here is the HTML code that defines that entire left column

<div class='secondary'>
  <div class='navigation'>
    <ul>
      <li class='first'><span class="current">Search for Homes</span></li>

      <li><a href="/properties">All Properties</a></li>
      <li><a href="/properties/open_houses">Open Houses</a></li>
      <li>
        <a href="/properties/global_property_search">Luxury Properties</a>
      </li>
    </ul>
  </div>

  <ul class='subnav'>
    <li>
      <span>Map Search</span>
      <ul>
        <li>
          <a href="/properties/google_map_search">Google Map Search</a>
        </li>
      </ul>

    </li>
  </ul>
  <ul id='blocks'>
    <li>
      <div class='block' id='block-open-house'>
        <h4>
          <a href='#'>
            <span>Open House</span>

          </a>
        </h4>
      </div>
    </li>
    <li>
      <div class='block' id='block-sold-listings'>
        <h4>
          <a href='/properties?status=sold'>
            <span>Sold Listings</span>

          </a>
        </h4>
      </div>
    </li>
    <li>
      <div class='block' id='block-email-updates'>
        <h4>
          <a href='#'>
            <span>Email Updates</span>

          </a>
        </h4>
      </div>
    </li>
  </ul>
</div>

here's the CSS, according to Firebug (yes, I know the selectors are unusually long, the stylesheet output is compiled from SASS)

body #wrapper #document #content .secondary {
border-top:1px solid #A6A6A6;
float:left;
padding:0px;
width:245px;
}

body #wrapper #document #content .navigation {
clear:both;
position:static;
}

body #wrapper #document #content .navigation ul li.first {
border:0pt none;
}

body #wrapper #document #content .navigation ul li {
border-top:1px solid #F5DFA5;
padding-bottom:7px;
padding-top:7px;
position:relative;
}

That's all there is to it. I must be missing something here... any light-shedding would be worshiped at this point. :'(

[katarey]

Hay you have placed both image same?

[shockeye]

I just noticed that myself, I edited the original post with the correct images.

[shockeye]

We figured it out, it was a position: relative; bug.