Question

如果我在页面的最后一个元素上添加一个margin-bottom（在我的情况下为div），它在IE 9中被忽略。换句话说，最后一个元素与窗口底部齐平。

这是一个已知问题吗？它在Chrome / Firefox中正常运行。

Answer 1

如果div被浮动但是包含的div不是。

，这是真的

<div class='outer'>
   <div class='inner'>dfsdfs</div>
   <div class='inner'>sdfsdf</div>
   <div class='inner'>vxcvxv</div>
   <div class='inner'>cvxcv</div>
</div>

div.outer {
   background: green;
}

div.inner {
   height: 50px;
   background: red;
   margin-bottom: 50px;
   display:block;
   float:left;
   clear:left;
}

Answer 2

我已经设置了一个简单的测试，看看我是否可以重现您的问题。首先，在您的带领下，我提供了一些HTML - 确保将最后一个元素设为div：

<div></div><div></div>
<div></div><div></div>

然后是一些风格：

div {
  height: 50px;
  background: red;
  margin-bottom: 50px;
}

然后我继续使用browserstack在Windows 7上测试IE9 - 我无法重现您的问题。就我而言，浏览器在最后一个元素周围正确地渲染了适当的间距。

小提琴：http://jsfiddle.net/jonathansampson/EgjVn/

IE 9忽略页面上最后一个元素的margin-bottom

2 个答案: