Question

我有一个嵌套的div元素：

        <div id="footer">
            <div id="footer_text">
                <p>My foooo text</p>
            </div>
        </div>

及其CSS代码：

#footer
{
    position: absolute;
    bottom: 0px;
    margin-bottom: 5px;
    margin-right:50px;
    margin-left:50px;
    width:90%;
    height:16px;
    color:white;
    font-size:12px;
    background:#000000;
    border-style:solid;
    border-width:1px;
    border-color:#F0FFFF;
    text-align: center;

}

似乎在firefox 7中运行良好。问题是它只在我没有

时才有效

<p>My foooo text</p>

当我添加它时，会出现div边框外的文本，并且它还会显示一个恼人的垂直滚动条。

我在这里尝试了一些解决方案，但我似乎无法使其发挥作用..

Answer 1

这是因为p元素具有默认边距

我认为在开始时为所有内容重置边距和填充是一个很好的解决方案：

* {
padding: 0;
margin: 0;
}

无论如何你可以添加

p {
margin: 0;
}

此外，您无需根据需要设置页脚高度即可。最好使用填充。当您设置相同的顶部和底部填充时，您将使所有内容垂直居中

文本在div内对齐

1 个答案: