IE7显示问题（添加额外的顶部边距）

我有一个非常艰难的时间搞清楚为什么IE7添加额外的填充到这个页面！IE7显示问题（添加额外的顶部边距）

正确的页面必须连接到上图中的三个黑色标签。这是它应该看起来如何：也存储在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>

来源

2010-12-17 sahand

你需要包含一些示例代码/ css /东西。我们无法从静态图像调试... – FatherStorm 2010-12-17 22:48:14

很难说实际上没有一些代码。至少为该页面的该部分添加CSS /属性定义如何？还是你使用了一些所见即所得的编辑器，但不知道实际的HTML/CSS？ – Mario 2010-12-17 22:49:21

请发布一些html和css。有了它，它就会像算命先生 – Fatih 2010-12-17 22:51:33

不知道，但尝试了这一点在你的CSS做

body 
{ 
    padding:0; 
    margin:0; 
}

http://www.w3schools.com/css/css_margin.asp http://www.w3schools.com/css/css_padding.asp

或者希望看到别人发布的一些代码。

来源

2010-12-17 23:01:24 shaunhusain

。我也尝试将它添加到这个页面，但没有运气。 – sahand 2010-12-18 00:27:22

使用：

display: inline;

希望这有助于。

来源

2010-12-18 00:17:07 Adamski

我试图添加内联，它并没有帮助:( – sahand 2010-12-18 00:27:50

好吧，如果你仍然无法找到解决方案，即有一个双重保证金错误，阅读关于CSS框模型或为了方便使用条件像这样：这段代码的地方在文档的头部，，并且只有当您在指定的浏览器中时才会使用此样式表。并添加另一个样式表只是为了你有问题，并删除额外的余量或任何你遇到的问题希望这可以帮助 – Adamski 2010-12-18 00:55:26

尝试从#background中删除margin-top:，而是为#background添加clear:both或clear:right。

来源

2010-12-18 18:36:19

我这样做是为了每一页：

<body> 
<!--[if IE]><div class="ie"><![endif]--> 

...LALALA 

<!--[if IE]></div><![endif]--> 
</body>

这就是所谓的条件注释。它是IE专有的，但对其他浏览器和验证程序的评论类似。

现在您可以使用.ie祖先指定IE特定规则。

得到一些.ie #whatever {position：relative;}继续，并把那些框放在他们应该是的地方！

来源

2011-11-23 14:39:07

一般来说，特别是对于IE7，但无论如何，为了更好的实践，总是指定所有双方w /填充或边距...换句话说不只是使用margin-top：？px（？for anything）并假设其余的都很好。更好地使用保证金：？px 0 0 0或任何值。

另一个一般的想法，特别是在IE 7及以下版本中，不要在同一个元素上使用margin和padding。

此外，浮动的任何东西都需要一个宽度，而且对于双重保证金的错误，它只发生在元素浮动的边的同一边上时......所以如果你声明浮动：对某事而言，你不想拥有保证金：0 20px 0 0在同一件事上......它会变成一倍。最好在包含元素上使用填充。

来源

2012-01-29 12:49:05

IE7显示问题（添加额外的顶部边距）

回答

相关问题