重新調整網頁造成divs重疊

我右側的div標籤重疊到我的中心列上...我已經爲我的父級div標籤設置了最小寬度，但它沒有幫助提升問題。

加上我的導航欄給了我一個小問題..當我重新調整我的網頁時，參與將落在ABOUT選項卡下。我在我的CSS中設置了display: block;和display: inline;。它工作正常，只是調整大小是傷害我的網頁..

我的佈局是基本..

<body> 
    <div style="width:100%; margin-top: -18px; clear: both;"> 
     <div style="width: 100%; height: 100px; background-color: white;"> 
      <p style="padding-top: 3%;font-size:30px; font"><i>Welcome</i></p> 
     </div> 

     <div style="width: 100%; display: block; overflow: hidden; "> 
      <div><li><a href="http://www.albany.edu/" class="nav">About</a></li></div> 
      <div><li><a href="http://albany.bncollege.com/" class="nav">Books</a></li></div> 
      <div><li><a href="#AM" class="nav">Electronics</a></li></div> 
      <div><li><a href="#UA" class="nav">Apparel</a></li></div> 
      <div><li><a href="#SP" class="nav">Activities</a></li></div> 
      <div><li><a href="#SL" class="nav">Engagement</a></li></div> 
     </div> 
     <div style="float: left; background-color: white; margin-left: 80px;"> 
     </div> 
     <div id="left-col" style="clear: left;"> 
     </div> 
     <div id="central-col"> 
     </div>  
     <div id="right-col" style="text-align: center; clear: right; "> 
     </div> 
     <div id="footer"><p style="text-align: center;">KNOWLEDGE IS POWER</p> </div> 
    </div> 
</body>

來源

2013-05-08 user2360681

如果你已經給予了充分的代碼（可在的jsfiddle）這將是更好，因爲通過查看代碼很難理解這些div的功能。（你已經做了這麼多的。）

您的解決方案，我認爲你必須從第二和第三DIV刪除

width: 100%

。

您已將margin-left設置爲80px，因此無論您何時調整窗口大小，它的左邊邊距都將保持80px。

另外我想知道使用

溢出：隱藏;

在您的代碼中。

來源

2013-05-08 04:39:40

我在我的導航欄中添加了overflow：hidden屬性，認爲它可以防止在頁面重新調整大小時該欄受到影響。試圖通過測試並試圖理解我做錯了什麼，來教我自己最好的方式。 – user2360681 2013-05-08 04:49:57

但它會省略你的內容，不是嗎？使其溢出：auto; – 2013-05-08 04:58:13

這裏是一個鏈接我的網頁http://www.albany.edu/~bk838732/SampleWeb_Killebrew.html – user2360681 2013-05-08 05:03:40

重新調整網頁造成divs重疊

回答

相關問題