菜单浮动到右边的IE和左边的FF

我正在一个网站上有一个菜单在FF上正确的行为，但不在IE上（如usuall）。
在IE上，它漂浮在右边，它应该浮动到左边，但是如果float设置为none，它的行为几乎是正确的，将它附加到容器的顶部。 Here's a live example.
这里的CSS：菜单浮动到右边的IE和左边的FF

/* Navigation */ 
.navigation 
{ 
    float: left; 
    overflow: hidden; 
    width: 650px; 
} 

.navigation ul 
{ 
    list-style: none; 
    margin: 8px 0 0 15px; 
    overflow: hidden; 
} 

.navigation ul li 
{ 
    border-right: 1px solid white; 
    float: left; 
    padding: 0 12px 0 12px; 
} 

.navigation ul li.last 
{ 
    border: none; 
} 

.navigation ul li a 
{ 
    color: white; 
    font-size: 14px; 
    text-decoration: none; 
} 

.navigation ul li a:hover 
{ 
    text-decoration: underline; 
} 

.navigation ul li a.active 
{ 
    font-weight: bold; 
} 

.btn_login 
{ 
    float: right; 
    margin: 4px 4px 0 0; 
    display: inline; 
    width: 200px; 
}

而这里的HTML：

<div id="navigation_wrap"> 
      <div class="navigation"> 
       <ul> 
        <li><a class="active" href="default.asp">Home Page</a></li> 
        <li><a class="" href="faq.asp">FAQ</a></li><li><a class="" href="articles.asp">Articles</a></li> 
        <li><a class="" href="products.asp">Packages &amp; Pricing</a></li> 
        <li><a class="" href="gp.asp?gpid=15">test1</a></li> 
        <li><a class=" last" href="gp.asp?gpid=17">test asher</a></li> 
       </ul> 
      </div> 
      <div class="btn_login"> 
       ... 
      </div> 
</div>

我希望任何人都会有一个想法。
谢谢，
奥马尔。

编辑：
设置两个元素的宽度有点帮助，但它仍然没有正确定位。查看上面更新的CSS。

来源

2010-03-15 the_drow

已编辑...忘了添加链接。 – 2010-03-15 12:31:03

不确定为什么class =“”=空类的额外标记？ – 2010-03-15 12:55:23

只是因为经典的ASP，我可以删除它，但它应该没有效果 – 2010-03-15 12:56:15

你可以尝试减少你的标志类的高度。它突出了菜单。

来源

2010-03-15 12:58:01

这有效，但它太小了。它只有99px高。任何其他方法来解决这个问题？ – 2010-03-15 13:00:09

将徽标的高度减少9 px，并定义两个div工作的宽度。非常感谢:) – 2010-03-15 13:42:37

刚从午餐回来 - 很高兴你已经修好了！ – 2010-03-15 13:53:53

< -span类=“” top_nav_separator“”>是在你的代码，这可能是困扰IE

来源

2010-03-15 12:32:57 Machiel

找到了。没有影响... – 2010-03-15 12:34:05

我在IE前段时间有同样的问题的东西。它不喜欢浮动div中的列表项。添加下面的固定它给我：

display: list-item; 
list-style-position: inside;

来源

2010-03-15 12:44:07

我应该在哪些标签中放置它们？ – 2010-03-15 12:54:21

把它们放在你的CSS中的li标签中。 li display：list-item; list-style-position：inside; } – 2010-03-15 14:11:54

它似乎没有影响任何东西。 – 2010-03-15 20:00:18

菜单浮动到右边的IE和左边的FF

回答

相关问题