動態創建的div poistioning問題

我在下面heirachy動態創建的div poistioning問題

<div class="box"> 
Content goes here 
<div class="footer>Footer</div> 
</div> 
<div class="box"> 
Content goes here 
<div class="footer>Footer</div> 
</div> 
<div class="box"> 
Content goes here 
<div class="footer>Footer</div> 
</div>

主箱「盒子」建立的div是可滾動的。我希望頁腳「頁腳」保留在父容器的底部，即「框」。我在Google上搜索了三天。沒有工作。非常焦慮。請幫助

來源

2012-04-29 user1364110

你的意思是你想讓它堅持到盒子的底部，無論滾動？請分享您的CSS代碼。 – 2012-04-29 12:00:08

您必須使用絕對位置和最低位0像Sarfraz上面說的。

這裏是示例代碼：

<html> 
<head> 
<style> 
body { width:100%;} 
.box { float: left; height: 200px; margin-right: 5%; position: relative; width: 20%;} 
.footer {bottom: 0px; position: absolute; width: 100%; text-align: center;} 
.box_content{ height: 180px; overflow-y: scroll;} 
.clear { clear:both;} 
</style> 
</head> 
<body> 
<div class="box"> 
    <div class="box_content"> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
    </div> 
    <div class="footer">Footer</div> 
</div> 
<div class="box"> 
    <div class="box_content"> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
    </div> 
    <div class="footer">Footer</div> 
</div> 
<div class="box"> 
    <div class="box_content"> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
     Content goes here <br /> 
    </div> 
    <div class="footer">Footer</div> 
</div> 
<div class="clear"> </div> 
</body> 
</html>

來源

2012-04-29 12:14:41 tienrocker

動態創建的div poistioning問題

回答

相關問題