如何在此div結構中推送div？

我已經嘗試了很多東西，但我還沒有找到一個體面的解決方案。如何在此div結構中推送div？

雖然設計方法 - 一個網頁，我使用這個佈局設計（佈局設計在背景部分使用不同全長彩色條紋）：

<body> 
<div id="wrap_banner" class="bg_banner"> 
<div id="wrapcentering_banner"> 
    <p>Here comes banner</p> 
</div> 
</div> 
<div id="wrap_middle" class="bg_middle"> 
<div id="wrapcentering_middle"> 
    <p>text</p> 
</div> 
</div> 
<div id="wrap_footer" class="bg_footer"> 
<div id="wrapcentering_footer"> 
    <table width="879" border="0" cellspacing="0" cellpadding="0"> 
     <tr> 
     <td class="text_webmade"> 
    <p> 
    Company</p></td> 
     </tr> 
    </table> 
</div> 
</div> 
</body>

CSS包含以下內容：

#wrap_banner, #wrap_middle, #wrap_footer { 
position: relative; 
height: auto; 
} 

#wrapcentering_footer { 
    position: relative; 
    width: 1000px; 
    left: 50%; 
    margin-left: -500px; 
    height: 100%; 
    top: 0px; 
} 

#wrapcentering_middle{ 
     position: relative; 
     width: 1000px; 
     left: 50%; 
     margin-left: -500px; 
     height: auto; 
     top: 0px; 
    } 


#wrapcentering_banner { 
     position: relative; 
     width: 1000px; 
     left: 50%; 
     margin-left: -500px; 
     height: 200px; 
     top: 0px; 
    } 

.bg_middle, .bg_footer, .bg_banner { 
    width: 100%; 
    position: relative; 
     background-color:#FFF 
}

問題：

任何div我將放入包含自動高度的wrapcentering_banner不會推入頁腳div。根據Z-index，它將內容放在頁腳div的頂部，但不會推送div。

我試圖把一些相對div放在一個容器div（wrapcentering div內）使用自動高度和浮動左，但仍然沒有什麼是推動divs。 Offcourse絕對div也不起作用。

我必須得到顯示的內容的唯一解決方案是給wrapcentering div一個特定的高度，並確保內容是爲該高度。或者我必須在wrapcentering div中使用表格。表格推動頁腳divs向下。

由於我不是表的大粉絲，有沒有辦法推動這些divs？

謝謝。

來源

2012-01-17 user1153528

您可以嘗試給自動高度和浮動到wrapcentering_banner div和清除頁腳div的浮動。這將確保頁腳div不會與上面的div一起浮動，並將其放置在其他div下面。

來源

2012-01-17 09:54:00

如何在此div結構中推送div？

回答

相關問題