更改div位置 - div另一個div

我有一個固定的導航div和10％透明 - 此div位於我的網頁頂部。我創建了另一個div，我希望它位於第一個div的底部。當我運行代碼時，第二個div開始在我的網頁頂部，由於我的透明div，我可以看到第二個div。更改div位置 - div另一個div

我知道有一個選項可以設置第二個div頂部的位置爲px，但我希望有另一個更簡單的方法來做到這一點（尤其是因爲我打算在第二個div後添加另一個div）。

這是我的HTML代碼：

<body> 
<div id="header"> 
    <div id="nav_bar"> 
     <ul> 
      <li><a href="#">1</a></li> 
      <li><a href="#">2</a></li> 
      <li><a href="#">3</a></li> 
      <li><a href="#">4</a></li> 
      <li><a href="#">5</a></li> 
     </ul> 
    </div> 
</div> 

<div id="main_pics"> 
<!-- photos here --> 

</div>

這是我的CSS代碼：

#nav_bar{ 
border: 2px solid black; 
background: rgba(255,255,255,0.98); 
height: 55px; 
position: fixed; 
width: 100%; 
top: 0; 
left: -2px; 
} 
#main_pics{ 
width: 80%; 
background-color: gray; 
height: 500px; 
margin: auto; 
}

來源

2015-01-09 APRULE

看喲之間的討論你和maioman，用簡單的方法無法真正理解你的意思。

第一種方法（同maioman建議是什麼）：http://jsfiddle.net/u6eydqw8/ 隨後的DIV的main_pics後addedd不需要把任何*-top了..

第二種方法，添加具有相同的一個無形的容器高度（包括邊框寬度）到DOM，那麼您不需要調整*-top。可以看到這裏http://jsfiddle.net/u6eydqw8/1/

請評論，如果這是你在找什麼？

來源

2015-01-09 10:04:03 ChinKang

tnx !!!!我的意思是你的第一個例子。 – APRULE

添加position:fixed ; top:0;到#nav-bar CSS屬性

和display:block ; margin-top:60px // (or the size you need ...)到＃主圖片

來源

2015-01-09 09:13:29 maioman

但正如我所說的，它的位置是固定的 – APRULE

的重要組成部分是設置一個邊緣到您的下面的div .... – maioman

我知道簡單的答案是添加margin-top，但我問了一個簡單的方法，主要是因爲我想添加更多的div，我不想用添加的每個div來計算頂部。請閱讀我要求的內容... – APRULE

更改div位置 - div另一個div

回答

相關問題