IE11 宽度：100% 和最大宽度：300px；在一个元素上

Question

我在 IE11 中遇到以下 markup/styling 问题：

main{
  width: 100%;
  max-width: 300px;
  margin: 0 auto;
}

<main><p>lorem</p></main>

问题是 IE11 不遵守最大宽度。

它在 < IE11、带有新 spartan 引擎的 IE11 和所有其他浏览器中按预期工作。

Answer 1

IE 的 main 元素的浏览器样式表中还没有 display:block – 将其添加到您自己的样式表中应该可以解决问题。

main {
  display:block;
  /* rest of your properties */
}

IE11 width: 100% and max-width: 300px; on an element