另一個div的div填充影響其他元素

你好我試圖創建一個導航欄，它是由一個大的導航div中的幾個div容器組成的。另一個div的div填充影響其他元素

我不知道如果我的做法是正確的，但我試圖做這樣的：

<div id="navigation"> 

    <div class="innen"> 
     <div class="logo"> 
      <a href="index.html"><img class= "logo" src="logo.png" title="Logo"/></a> 
     </div> 

     <div id="bar"> 
     <!-- Navigation Items are in here --!> 
     </div> 

     <div id="gamecard"> 
     <!-- Another right floated Element !--> 
     </div> 
    </div> 
    <div class="unten"> 
     <p>You are here: <a href="index.html">Main</a></p> 
    </div> 
</div>

我想壓低條格使用的頂部填充，以滿足圖像的高度：

#bar{ 
padding-top: 80px; 
}

但現在它也移動了向下的遊戲卡容器。我怎樣才能防止這種情況發生？

我還添加了jfiddle： http://jsfiddle.net/Cv4p2/

來源

2013-01-09 arnoapp

#bar { position：relative; top：80px; } – Evgeny

http://caniuse.com/#feat=css-gradients你不需要_that_梯度的許多供應商前綴 – Evgeny

嘗試使用的位置是：絕對

<div id="bar" style="position:absolute; padding: 80px 0 0 0"> 
</div>

來源

2013-01-09 00:28:33 kirk

它的作品，但它破壞了浮動。 Menubar現在在形象中。有沒有辦法避免它？ @尤金-Xa的方法工作，但有什麼更好的？ – arnoapp

您需要更改填充，請嘗試將[頂部] [右側] [底部] [左側]更改爲您需要的位置。嘗試像這樣的填充：80px 0 100px 0 – kirk

確定已經玩過它，它可以工作，但它爲什麼與'{position：relative; top：80px; }'？ – arnoapp

填充的目的是增加在其中實現它的容器內的氣墊。看起來你會從使用保證金中受益。您應該替換「padding-top：80px;」「margin-top：80px;」你會達到預期的效果。

來源

2016-12-03 06:17:55

另一個div的div填充影響其他元素

回答

相關問題