我很难弄清楚为什么 IE7 会为此页面添加额外的填充!
这就是 IE7 正在做的事情: http://imgur.com/lwyRI.png
正确的页面应该有连接到上图的三个黑色标签。 这是它应该看起来的样子:也存储在 imgur 上:64qbf.png (我只允许一个链接)
页面链接可以在img中找到。 (同样我只能发布一个链接)
请帮忙!
CSS 代码:
<style type="text/css">
#background{
background-image: url(/images/store/vaporIronBK.jpg);
background-repeat:no-repeat;
height:auto;
width:665px;
margin-top:125px;
margin-left:228px;
padding-top:5px;
font-size:15px;
}
#background a {
color: #ffffff;
text-decoration: none;
}
#background a:hover {
color: #de156d;
}
#videoLinks {
margin-top:52px;
height: 100px;
}
#buy{
width:400px;
float:left;
clear:both;
padding-left:235px;
color:#000000;
}
#video {
float: right;
left: 683px;
margin-left: 35px;
margin-top: 166px;
width: 200px;
color: #000000;
}
#video a {
text-decoration: none;
color: #000000;
}
#video a:hover {
color: #de156d;
}
#footnotes {
color:#ffffff;
margin-top: 37px;
}
#bottom-text {
margin-left:40px;
margin-top:445px;
width:575px;
}
#bottom-text a {
color: #de156d;
text-decoration: none;
}
#bottom-text a:hover {
color: #000000;
}
#bottom-text p {
text-align: justify;
}
#bottom-text h2 {
font-size: 25px;
color: #000000;
padding-bottom: 10px;
}
#bottom-text h3 {
padding-bottom: 5px;
}
#bottom-text p {
padding-bottom: 20px;
}
#bottom-text .header-text {
padding-bottom: 25px;
}
#bottom-text p.taylor-image {
text-align: center;
}
.tabs {
height: 30px;
width: 180px;
float: left;
margin-left: 30px;
padding-top: 10px;
}
</style>
最佳答案
我对每个页面都这样做:
<body>
<!--[if IE]><div class="ie"><![endif]-->
...LALALA
<!--[if IE]></div><![endif]-->
</body>
这叫做条件注释。它是 IE 专有的，但就像 对其他浏览器和验证器的评论。
现在您可以使用 .ie 祖先指定 IE 特定规则。
得到一些 .ie #whatever{position:relative;} 继续并把那些 盒子在它们应该在的地方!
关于html - IE7 显示问题(添加额外的上边距)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4475416/