Firefox中的CSS下拉位置错误

Question

下拉列表在Chrome中显示正常但不是FF？

http://bit.ly/1pjqnPu

思想？

Answer 1

删除float:left上的<ul>：

<ul id="menu" style="float:left;">

变为：

<ul id="menu">

然后在你的CSS中设置<li>到display:block和float:left ......

.navigation ul li {
    display: block; /* new */
    float: left; /* new */
    margin: 0;
    padding: 0;
}

...并将子菜单置于top:100%

ul#menu li ul.sub-menu {
    display: none;
    position: absolute;
    top: 100%; /* amended */
    width: 100px;
    z-index: 10;
}

Answer 2

您必须将left: 0;添加到ul#menu li ul.sub-menu