html - 移动设备和旧浏览器上的内容溢出

Question

我有一个具有固定高度和内容的容器。我一直在使用“em”来调整字体大小，并且它一直适用于现代版本的 FireFox 和 IE。但是我在我的手机和旧版本的 IE(6) 上检查了它，内容从容器底部溢出到页脚。到目前为止，我已经尝试将此容器的高度更改为自动!重要并将固定高度设置为最小高度，但这没有用。我也将 em 更改为相应的 px 大小，但这也不起作用。 HTML 和 CSS 看起来像这样。

#container {
    width:570px;
    height:570px;
    font-size:1.2em;
    text-align:left;
   }

#container p {
    margin-left:35px;
    margin-right:35px;
 }

#foot {
    width:570px;
    height:60px;
    clear:both;
 }

<div id="container">
    <p>Content1</p> 
    <p>Content2</p>
    <p>Content3</p>
</div>    

<div id="foot">
</div>

Answer 1

将 overflow: hidden; 添加到 #container 的 css 和 display: block; 还有 height:auto !important ;

#container {
    width:570px;
    height:auto !important;
    display: block;
    font-size:1.2em;
    text-align:left;
   }