display flex对Chrome中的摘要标记不起作用?

lag*_*lex 2 html css google-chrome flexbox

我有一个带有一些子元素display: flex<summary>标签<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%;
}
Run Code Online (Sandbox Code Playgroud)
<summary>
  <h3>Heading</h3>
  <p>1</p>
  <p>2</p>
  <p>3</p>
</summary>
Run Code Online (Sandbox Code Playgroud)

Woo*_*low 7

所述summary元件不是结构标签,它有自己的显示属性.它意味着details标签的切换可见性框.

根据MDNCanIUse,Chrome已经完全实现了summary标签,而Firefox则没有.对于未实现的标记类型,大多数主要浏览器的默认行为是将该元素绘制为通用块级元素.因此,在Firefox中,使用summary标记与使用div标记基本相同.在Chrome中; 但是,它很可能被渲染为替换元素,这意味着(除其他外)你不能覆盖它的显示类型.

编辑:summary标签现在也在Firefox中实现,从版本49开始.