横向css导航问题

时间:2011-05-18 21:16:51

标签: html css

你好,不知道为什么但导航有问题。它似乎是溢出的,如果我在一个浏览器中修复它在另一个浏览器中失败。所以我不确定它有什么问题。最近CSS坏了,整个菜单都搞砸了。

任何方式都是网站http://www.otaku-plus.com/triton

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

这是菜单的css位

#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有什么问题吗?或HTML

1 个答案:

答案 0 :(得分:2)

我为您的问题找到了可能的解决方案。见this

#mainNav向左浮动,#login向右浮动。

我调整了你的标记。