Question

我为这个问题找了几个链接，但没有一个修复对我有用我使用了Padding，但结果仍然相同。
我使用position: relative，仍然使用相同的结果......

我有一个CSS，如下所示：

.ItemsStyle
{
    margin-top: 5px;
    margin-bottom: 5px; 
    width: 720px;
}

我的div如下所示：

<div id="Items" class="ItemsStyle">
                            <!--Work Here... -->
</div>

我在这个div上面有一个文本框，看起来像是：

<input id="textBoxName" type="text" style="width: 415px; font-family: Verdana"/>

现在，我希望在我的文本框和我的div之间有5px的边距。 CSS在IE 11上工作得非常好，保证金也很好但是，当我在IE 8上运行我的应用程序时，边距更多，就像我需要5px时文本框中的30px一样。

我已经尝试并测试了其他类似帖子中建议的所有方法，但我得到了相同的结果。

Answer 1

我尝试使用以下代码在虚拟机上复制它，但无法：

<style type="text/css">
.ItemsStyle{
    margin-top: 5px;
    margin-bottom: 5px; 
    width: 720px;
    background:#f00;
    height:200px;
}
</style>
<input id="textBoxName" type="text" style="width: 415px; font-family: Verdana"/>  
<div id="Items" class="ItemsStyle">
    <!--Work Here... -->
</div>

然而，您可以在输入上使用margin-bottom而不是在div上使用margin-top。你应该得到你正在寻找的结果：

<style type="text/css">
.ItemsStyle{
    margin-bottom: 5px; 
    width: 720px;
}
</style>
<input id="textBoxName" type="text" style="width: 415px; font-family: Verdana; margin-bottom:5px;"/>  
<div id="Items" class="ItemsStyle">
    <!--Work Here... -->
</div>

作为一般＆＃34;流程＆＃34;在文档中我尝试将所有向下（即边距底部，填充底部）推送到页面而不是向上（即margin-top，padding-top）

Answer 2

Internet Explorer 8对于任何开发人员来说都是一个令人头痛的问题。试试这段代码：

    .ItemsStyle
{
    margin: 5px auto;
    width: 720px;
}

CSS Margin Top在IE 8上无法正常工作

2 个答案: