IE、Firefox 中的 CSS 定位“错误”

Question

我对 HTML/CSS 还很陌生，所以这可能是一个相当简单的解决方法。我正在设计/编码我公司的新网站 (outofboundscreative.com/inprogress/index.html)，并且我遇到了我认为是跨浏览器支持的 CSS 中的最后一个障碍。在 Safari、Chrome 和 Opera 中，页脚中的版权段使用 top: 10px 正确定位；但是，当我在 IE 或 Firefox 中查看页面时，它的位移比想要/需要的多 10px，然后将 div 推到几乎看不见的地方。我知道每个浏览器使用定位：和显示：略有不同，但这个确实让我难过。当我进行一项更改时，它在 IE/Firefox 中看起来很棒，但随后将 div 推到了表格区域中。有什么建议么？提前感谢您的帮助。

作为参考，这是有问题的代码：

footer {
left: 0;
clear: both;
width: 100%;
height: 55px;
bottom: 0px;
cursor: default;
display: block;
z-index: 1000;
overflow: hidden;
position: fixed;
background-color: rgba(0,0,0,.9);
}

#footer-line-left {
top: 20px;
right: 50%;
float: left;
clear: both;
width: 1000%;
height: 2px;
position: absolute;
margin-right: 220px;
background-color: rgba(255,255,255,1);
}

#footer-line-right {
top: 20px;
left: 50%;
float: left;
clear: both;
width: 1000%;
height: 2px;
position: absolute;
margin-left: 220px;
background-color: rgba(255,255,255,1);
}

table, tr, th {
top: 5px;
z-index: 1000;
position: relative;
font-size: 10pt;
text-align: center;
font-style: italic;
font-weight: bold;
font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
margin-left: auto;
margin-right: auto;
}

#copyright {
top: 10px;
color: #444;
clear: both;
width: 100%;
display: block;
position: relative;
font-size: 11px;
font-style: normal;
text-align: center;
font-family: Helvetica, Arial, sans-serif;
margin-left: auto;
margin-right: auto;
}

Answer 1

在您的 p 标签中，您需要添加边距和内边距：

<div id="copyright">
p {
    display: block;
    margin: 0;
    padding: 0;
}