內部div不匹配父母的寬度

我有3個內部div全部左移。他們在一個寬度爲100％的父div中修剪。我有我的第一個內部div設置爲一個特定的寬度，然後我的下一個設置爲重複x背景和正確的坐在旁邊。內部div不匹配父母的寬度

他們內部沒有任何內容只是將持有背景精靈。所以你有一個左div，中心div和右div。中心一個將平鋪，而外部不平鋪。我很討厭的問題是他們需要一個特定的寬度，否則背景不會顯示。有沒有辦法讓中心顯示。我嘗試寬度100％，但它什麼也沒做。我可以使它工作的唯一方法是將父項的顯示設置爲表格。然後是內部表格。但是這在IE7中不被支持。

  <div id="subNav"> 
       <div class="subNav-left"></div> 
       <div class="subNav-middle"></div> 
       <div class="subNav-right"></div> 
      </div>

來源

2012-05-03 Chapsterj

你可以加入一些標記嗎？ – kinakuta

當div的高度爲0px時，爲什麼會顯示背景（顏色或圖像）？記住，你必須有一個div內的SOMETHING（甚至是），或者爲它設置一個高度，使其實際上大於0px ... – Minja

我知道你想顯示一個流暢的背景。第一個div顯示條的左邊部分，第三個顯示最後一個，中間一個重複背景，因此它可以是流動的。爲了實現這一目標而無需額外的編碼，只需指定重複的背景到主分區和浮法兩個內部的div，用他們各自的背景：

<div id="subNav"> 
    <div class="subNav-left"></div> 
    <div class="subNav-right"></div> 
    <div class="clear"></div> 
</div>

而CSS：

<style> 
#subNav{ 
    background: url(repeating_bk.png) top left repeat-x; 
    width:100%; 
} 
.subNav-left{ 
    width: 50px; /* specified */ 
    height: 20px; /* specified */ 
    background: url(left.png) top left no-repeat; 
    float:left; 
} 
.subNav-right{ 
    width: 50px; /* specified */ 
    height: 20px; /* specified */ 
    background: url(right.png) top right no-repeat; 
    float:right; 
} 
.clear { clear:both; } 
</style>

希望它能幫助。

來源

2012-05-03 23:51:27 lu1s

內部div不匹配父母的寬度

回答

相關問題