水平CSS导航问题

Question

你不确定为什么，但导航有一些问题。它似乎溢出，如果我在一个浏览器中修复它，则会在另一个浏览器中失败。所以我不确定它有什么问题。最近，CSS破裂了，整个菜单都变得混乱了。

继承人任何方式就是网站http://www.otaku-plus.com/triton

编辑：更新的代码位：http://jsfiddle.net/yukimura/hqyY2/embedded/result/

这里是菜单

#dropfish { 
    background-attachment: scroll; 
    background-clip: border-box; 
    background: #111111 url("images/top-bar-bg.png"); 
    background-origin: padding-box; 
    background-position: 0% 0%; 
    background-repeat: repeat-x; 
    background-size: auto; 
    color: #000000; 
    left: 0px; 
    padding-left: 2px; 
    padding-right: 2px; 
    padding-top: 2px; 
    top: 0px; 
    width: 100%; 
    height: 44px; 
    position: fixed; 
    z-index: 9999; 
    box-shadow:0px 1px 2px; 
} 

#dropfish_menu { 
    width: 90%; 
    height: 44px; 
    margin: 0 auto; 
} 

#dropfish_menu ul { 
    width: 90%; 
    height: 44px; 
} 

#dropfish_menu ul li { 
    float: left; 
    padding: 14px 0px; 
    margin-top: -1px; 
} 

#dropfish_menu a { 
    color: #ffffff; 
    text-shadow:0 -1px 0 #000000; 
    padding: 14px 16px; 
    font-size: 14px; 
} 

#dropfish_menu a:hover { 
    margin-top: 0px; 
    padding: 14px 16px; 
    /* background-color:#cdcdcd; */ 
    background-repeat: repeat; 
    background-color: #313131; 
    background-image: url("images/top-bar-bg.png"); 
    background-position: 50% 75%; 
    cursor: pointer; 
} 

.active { 
    background-color: #313131; 
    background-image: url("images/top-bar-bg.png"); 
    background-position: 50% 75%; 
} 

HTML位的菜单

<div id="dropfish"> 
<div id="dropfish_menu"> 
    <ul> 
    <div style="float:left;margin-left:-128px;"> 
    <li><img src="http://opcdn.otaku-plus.com/themes/plus/images/logo.png" height="34px" style="margin-top: -8px;margin-right: 8px; cursor: pointer;" id="phx_return_logo"/></li> 
    <li><a href="#!search.py" class="active" onclick="return: false;">Web</a></li> 
    <li><a href="#!anime.py" onclick="return: false;">Anime</a></li> 
    <li><a href="#!manga.py" onclick="return: false;">Manga</a></li> 
    <li><a href="#!news.py" onclick="return: false;">News</a></li> 
    <li><a href="#!events.py" onclick="return: false;">Events</a></li> 
    <li><a href="#!adv.py" onclick="return: false;">More</a></li> 
    </div> 
    <div style="float:right;margin-right:-128px;"> 
    <li><a href="#!register.py" onclick="return: false;" class="register">Register</a></li><li><a href="#!login.py" onclick="return: false;" class="signin">Sign in</a></li><li><a href="#!settings.py" onclick="return: false;" class="settings">Preferences</a></li> 
    </div> 
    </ul> 

</div> 
</div> 

的CSS位

有人可以告诉我什么是错的用我的CSS？或HTML

Answer 1

我为您的问题提出了一个可能的解决方案。请参阅this

#mainNav左边是浮动，而#login右边是浮动的。

我调整了你的标记。