css - 是一个允许有显示：网格？

Question

或者，更一般地说，是否有任何元素无法设置样式display:grid？

考虑：

button,
div {
  display: grid;
  grid-template-columns: 50px 50px;
}


/* Nevermind these, they're just for a consistent display */

button,
div {
  border: 0;
  background-color: gray;
  color: black;
  width: 100px;
  text-align: center;
  font-family: sans-serif;
  font-size: 14px;
  padding: 0;
}

Button:
<button>
  <span>A</span>
  <span>B</span>
</button>
<br> 
Div:
<div>
  <span>A</span>
  <span>B</span>
</div>

在 JsFiddle 上试试

这是Firefox (61.0.1) 中的结果：

这是Chrome (68.0.3440.106) 中的结果：

Chrome 似乎不喜欢我试图display:grid在按钮上使用。这只是一个错误吗？还是以某种方式有意为之？

标签： csscss-grid

Answer 1

显然这是 Chrome 上的一个错误，这里详细说明：

https://github.com/rachelandrew/gridbugs#10-some-html-elements-cant-be-grid-containers

并在这里跟踪：

https://bugs.chromium.org/p/chromium/issues/detail?id=375693

_{（我在这里看不到进展。如果它已修复，请编辑答案，或者如果我记得我会）}