html - 在 IE11 上忽略了 css 列数

标签 html css column-count

这是我网站上的一个问题,我在 js fiddle 上重现了这个问题,我正在尝试使用部分标签创建 5 列,使用列数,宽度均匀,这在 chrome/firefox/edge 上工作正常,但是在 Internet Explorer 11 上它会被忽略并将这些部分显示为 block 。

我读到 IE 应该支持列数,所以我很困惑为什么它被忽略了,这是一个错误还是我做错了什么? 我的 fiddle 在下面

https://jsfiddle.net/gqdL46j4/

html

<main>
  <section>
    <h1>Test1</h1>
  </section>
  <section>
    <h1>Test2</h1>
  </section>
  <section>
    <h1>Test3</h1>
  </section>
  <section>
    <h1>Test4</h1>
  </section>
  <section>
    <h1>Test5</h1>
  </section>
</main>

CSS

main  {
   -webkit-column-count: 5;
   -moz-column-count: 5; 
   column-count: 5;
}

section {
  width: 100%;
  display:inline-block;
}

最佳答案

<main> IE 不支持标签。它仅受 Firefox + Chrome + Edge 支持:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/main

这就是它不适用于列的原因。

关于html - 在 IE11 上忽略了 css 列数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38657417/

相关文章:

jquery - 当我登录 jquery 时,我怎样才能使登录按钮消失

html - 通过 SVG 元素传递的单击事件(无边界框)

css - 我如何使用 css 使导航栏背景图像缩放到导航栏边框

css - 使用列数,如果分辨率较小,您可以动态地将 3 列更改为 2 列吗?

html - 如何防止绝对定位的元素在 CSS 列中中断?

javascript - HTML/Javascript 已禁用,然后重新启用复选框已发布

javascript - 未定义类时如何从 ajax 响应中获取 anchor 标记值

javascript - 菜单导航栏网页: dynamic menu windows.画面

css - W3C 无效的 HTML 和 CSS 代码是否对 SEO 有害并给屏幕阅读器用户带来问题?

css - 带有 css 多列的有序列表号