Question

IE 11是否有盒子大小：边框问题？

这是推测的结构。 jsfiddle

HTML

<div class="container">
  <div class="left">
  </div>
  <div class="content">
    <div class="mainContent">
    </div>
    <div class="sidebar">
    </div>
  </div>
</div>

CSS

*, *:before, *:after {
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.left {
  background: tomato;
  width: 150px;
  float: left;
  bakcground: grey;
  height: 200px;
}
.content {
 margin-left: 175px;
 background: blue;
 height: 200px;
}
.mainContent {
  width: 70%;
  float: left;
  background: orange;
  height: 200px;
}
.sidebar {
  width: 30%;
  float: left;
  background: pink;
  height: 200px;
}

以下是实际使用的version。

正如您在此comparison中看到的那样，应用了边距的主容器宽度在包装元素上大于100％，然后堆叠列。几乎像盒子大小的方法不适用它？不知道我在这里缺少什么。

我也不确定＆＃34的含义;元素隐藏在基础浏览器中但不是目标。＆＃34;在comparison页面上看到。

Answer 1

见here。在{EI11}中，<main></main>未被识别为块元素。添加display: block可以解决问题。

main {
    display: block;
}

IE 11 <main>未被识别为块元素

1 个答案: