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;
}

在IE中，CSS定位“错误”，Firefox

1 个答案: