display flex 不适用于 Chrome 中的摘要标签？

Question

我在 <summary> 标签上有一个 display: flex 和一些子 <p> 元素。应该排成一排吧？确实如此，但仅限于 Firefox。不在 Chrome (43.0.2357.81) 上。只有我吗？

http://jsfiddle.net/laggingreflex/5e83uqf9/

summary {
  display: flex;
  flex-flow: row wrap;
}
summary h3 {
  display: block;
  flex: 1 100%;
}

<summary>
  <h3>Heading</h3>
  <p>1</p>
  <p>2</p>
  <p>3</p>
</summary>

Answer 1

summary元素不是结构标签，它有自己的显示属性。它是 details 标签的切换可见性框。

根据 MDN and CanIUse, Chrome has fully implemented the summary tag, while Firefox has not. For an un-implemented tag type, the default behavior of most major browsers is to draw the element as a generic block-level element. In Firefox, then, using the summary tag is essentially the same as using the div tag. In Chrome; however, it may very well be rendered as a replaced element，这意味着（除其他事项外）您无法覆盖其显示类型。

编辑：从版本 49 开始，summary 标记现在也在 Firefox 中实现。

display flex 不适用于 Chrome 中的摘要标签？

display flex doesn't work on summary tags in Chrome?

html

css

google-chrome

flexbox