爲什麼我的全角水平導航欄實際上不是全寬？

這個奇怪的問題。我希望以下網站上的導航欄伸展整個頁面寬度。爲什麼我的全角水平導航欄實際上不是全寬？

http://testing.xenongroupadmin.com/bitesize/profile/summary.php

乍一看，它會出現，它工作正常，沒有任何問題。但是，由於某種原因，底部有一個水平滾動條。當您滾動到右側時，導航欄突然停止，只留下一個很大的空白區域。

如何擺脫滾動條，使頁面停在導航欄的邊緣？

的導航欄的HTML代碼是：

<div id="topbanner"> 
<div id="logologin"> 

<image src="../images/minibitesizelogo.png" id="logo" alt="Xenon Group Bitesize Logo" /> 

<ul id="topnav"> 
<li id="profile"><a href="../profile/summary.php">Home</a></li> 
<li id="choose"><a href="../choose/intro.php">Choose a Course</a></li> 
<li id="about"><a href="../about/whatis.php">About Bitesize</a></li> 
<li id="contact"><a href="../contact/contact.php">Contact Us</a></li> 
<li id="logout">Log Out</li> 
</ul> 

</div> 
</div>

和相應的CSS是：

body { 
      font-family: arial, tahoma, verdana, sans-serif; 
    background: linear-gradient(top, #FFFFFF 62%, #CDEDFA 89%); 
    background: -o-linear-gradient(top, #FFFFFF 62%, #CDEDFA 89%); 
    background: -moz-linear-gradient(top , #FFFFFF 62%, #CDEDFA 89%); 
    background: -webkit-linear-gradient(top, #FFFFFF 62%, #CDEDFA 89%); 
    background: -ms-linear-gradient(top, #FFFFFF 62%, #CDEDFA 89%); 
    margin: 0px; 
    width: 100%; 
    } 

div#topbanner { background-image: url('../images/navbar5.png'); 
     height: 55px; 
     background-repeat: repeat-x; 
     } 

div#logologin { margin: auto; 
     width: 950px; 
     } 

#logo { 
    float: left; 
    margin-top: 2px; 
    margin-right: 15px; 
    margin-left: 23px; 
     } 

ul#topnav { list-style-type: none; 
    margin: 0px; 
    } 

ul#topnav li { 
     width: 153px; 
     text-align: center; 
     border-left: thin solid #02a2e0; 
     height: 39px; 
     padding: 0px; 
     padding-top: 16px; 
     float: left; 
     background-image: url('../images/navbar5.png'); 
     } 

ul#topnav li#logout { border-right: thin solid #02a2e0; 
      }

解決任何幫助，這將不勝感激！

謝謝！

來源

2012-03-09 Chris

您的包裝div的寬度爲1500px。刪除它或將其更改爲100％，你應該沒問題。

來源

2012-03-09 21:27:44 j08691

也許有一天我會停止錯過最簡單的錯誤，並節省自己很多時間！謝謝！！ – Chris 2012-03-09 21:43:47

適用於我們所有人;） – j08691 2012-03-09 21:44:16

使用Dominspector，我看到你了#wrapper指定屬性

width: 1500px;

擺脫這一點，它工作正常。

編輯：哎呦，太晚了：V

來源

2012-03-09 21:29:28 Kisaro

稍遲一點 - 但無論如何謝謝！ – Chris 2012-03-09 21:44:46

爲什麼我的全角水平導航欄實際上不是全寬？

回答

相關問題