html - 缩放时如何使我的绝对底部容器保持静止？

Question

我想知道当有人放大或缩小时如何阻止底部文本四处移动。页面的其余部分到目前为止保持静止，但因为我不得不使用 position:absolute 来使这个特定部分停留在另一个 div(内容)的底部，它现在移动了。

#content {
border: 2px solid;
border-radius: 10px;
border-color:#ffffff;
box-shadow: 3px 3px 3px #999999;
}

#bottomsectioncontainer {
position:absolute;
bottom:0;
padding-left:200px;
padding-right:275px;
}

<div id="container2" style="width:1300px; height;975px; margin:auto">

<div id="content" style="background-color:#ffffff; height:975px";>

<!---content--->

<div id="bottomsectioncontainer" style="height: 5px; margin:auto;">


<div id="bottom1" style="width: 250px; float:left">


<h4 class="h4"> Example </h4>
<p class=bottompara>One thing <br>
Two Thing<br>
Three thing<br>
Four Thing<br>
Five Thing<br>
</p>

</div>


<div id="bottom2" style="width: 250px;float:left">

<h4 class="h4"> Example </h4>
<p class=bottompara>One thing <br>
Two Thing<br>
Three thing<br>
Four Thing<br>
Five Thing<br>
</p>


</div>

<div id="bottom3" style="width: 250px; float:left;">

<h4 class="h4"> Example </h4>
<p class="bottompara">One thing <br>
Two Thing<br>
Three thing<br>
Four Thing<br>
Five Thing<br>
</p>


</div>

</div>
</div>



</body>

</html>

http://tinypic.com/r/wwi35l/8

Answer 1

position:relative;

在 #content 中它会解决这个问题

同时从 bottomcontainer 中移除 height:5px