1

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

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

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;
}
4

2 回答 2

1

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

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

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

于 2016-07-29T11:28:50.067 回答
0

我刚刚尝试用 div 替换主标签,它现在可以工作了,是否有原因为什么它不能与主标签一起工作?

https://jsfiddle.net/gqdL46j4/3/

<div>
  <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>
</div>
于 2016-07-29T11:25:10.310 回答