導航欄偏移量？

正在修復我的導航菜單，因爲我遇到了Google Chrome用戶無法點擊我網站上的導航欄鏈接的問題。新的解決方案修復了它，但是我現在有一個導航欄，從一個頁面的佈局偏移而不是另一個。導航欄偏移量？

訪問http://www.survivaloperations.net爲主站點視圖（排隊）和http://www.survivaloperations.net/forums/論壇視圖（左偏移）。

HTML的資產淨值爲：

<ul id="nav"> 
     <li><a id="home" href="./news" alt="Home"></a> 
     <li><a id="members" href="./members"></a> 
     <li><a id="forums" href="./forums/" alt="Forums"></a> 
     <li><a id="about" href="./about"></a> 
     <li><a id="guides" href="http://www.survivaloperations.net/forums/viewforum.php?f=10"></a> 
     <li><a id="drawings" href="http://www.survivaloperations.net/forums/viewforum.php?f=6"></a> 
     <li><a id="faq" href="./faq"></a> 
     <li><a id="downloads" href="./downloads"></a> 
     <li><a id="sponsors" href="./sponsors"></a> 
     <li><a id="nav_break" href=''></a> 
     <li><a id="apply" href="./forums/application.php"></a> 
    </ul>

CSS的資產淨值爲：

#nav { margin:297px 0 0 -40px; position:absolute; } 

#nav a { display:block; 
    height:35px; } 

#nav li { display:inline-block; } 

#home { 
    background: url('http://survivaloperations.net/images/home.jpg') no-repeat bottom; width:106px; } 
#home:hover { 
    background: url('http://survivaloperations.net/images/home_up.jpg') no-repeat 
bottom; } 

#members { 
    background: url('http://survivaloperations.net/images/members.jpg') no-repeat 
bottom; width:96px; } 
#members:hover { 
    background: url('http://survivaloperations.net/images/members_up.jpg') no-repeat 
bottom; } 

#forums { 
    background: url('http://survivaloperations.net/images/forums.jpg') no-repeat bottom; width:96px; } 
#forums:hover { 
    background: url('http://survivaloperations.net/images/forums_up.jpg') no-repeat 
bottom; } 

#about { 
    background: url('http://survivaloperations.net/images/about.jpg') no-repeat bottom; width:96px; } 
#about:hover { 
    background: url('http://survivaloperations.net/images/about_up.jpg') no-repeat 
bottom; } 

#guides { 
    background: url('http://survivaloperations.net/images/guides.jpg') no-repeat bottom; width:96px; } 
#guides:hover { 
    background: url('http://survivaloperations.net/images/guides_up.jpg') no-repeat 
bottom; } 

#drawings { 
    background: url('http://survivaloperations.net/images/drawings.jpg') no-repeat 
bottom; width:96px; } 
#drawings:hover { 
    background: url('http://survivaloperations.net/images/drawings_up.jpg') no-repeat 
bottom; } 

#faq { 
    background: url('http://survivaloperations.net/images/faq.jpg') no-repeat bottom; width:96px; } 
#faq:hover { 
    background: url('http://survivaloperations.net/images/faq_up.jpg') no-repeat bottom; } 

#downloads { 
    background: url('http://survivaloperations.net/images/downloads.jpg') no-repeat 
bottom; width:96px; } 
#downloads:hover { 
    background: url('http://survivaloperations.net/images/downloads_up.jpg') no-repeat 
bottom; } 

#sponsors { 
    background: url('http://survivaloperations.net/images/sponsors.jpg') no-repeat 
bottom; width:100px; } 
#sponsors:hover { 
    background: url('http://survivaloperations.net/images/sponsors_up.jpg') no-repeat 
bottom; } 

#nav_break { background:url('http://www.survivaloperations.net/images/nav_spacer.jpg'); 
    width:254px; } 

#apply { 
    background: url('http://survivaloperations.net/images/apply.jpg') no-repeat bottom; width:108px; } 
#apply:hover { 
    background: url('http://survivaloperations.net/images/apply_up.jpg') no-repeat 
bottom; }

我沒有看到在論壇上也沒有正常的網站樣式表，會導致這樣的東西。如果我將-40px更改爲0，則會使正常站點紊亂並修復論壇。

任何想法都會很棒！

注：整個CSS可以在http://www.survivaloperations.net/style.css

來源

2012-08-09 Meta

首先來發現，你的導航休息時頁面大小。

#nav { 
    margin: 0 auto; 
    position: relative; 
    width: 100%; 
}

編輯

我注意到你有一個填充問題了。所以我會將padding: 0;添加到該CSS。

來源

2012-08-09 02:16:53

添加更改（ctrl + f5刷新並在兩頁上看到）正如您所看到的，論壇現在排隊，但主站點已損壞。 – Meta 2012-08-09 02:20:16

我用更新編輯了我的答案。 – 2012-08-09 02:21:48

AHA！填充問題從哪裏產生？我必須忽略它。我一直在努力嘗試解決我的舊導航整天完全重做導航到它現在是如何。大腦炸了。謝謝！ – Meta 2012-08-09 02:25:41

導航欄偏移量？

回答

相關問題