fieldset doesn't work properly as a flex container (display:flex)

Originator:cvrebert
Number:rdar://22607417 Date Originated:2015-09-08
Status:Open Resolved:
Product:Safari Product Version:8.0.8 (10600.8.9)
Classification:Other Bug Reproducible:Always
 
Summary:
See Flexbug #9: https://github.com/philipwalton/flexbugs#9-some-html-elements-cant-be-flex-containers

In http://codepen.io/anon/pen/MaYBoX , the children of the `display:flex` <fieldset> stack vertically, which is incorrect.

Compare this to the same code using a <div> instead of a <fieldset>,
where the children are correctly displayed horizontally: http://codepen.io/philipwalton/pen/EVaRaX

Steps to Reproduce:
1. Open http://codepen.io/anon/pen/MaYBoX in Safari

Expected Results:
The boxes in the webpage should be displayed in a single horizontal group, as can be seen in http://codepen.io/philipwalton/pen/EVaRaX

Actual Results:
The boxes in the webpage are stacked vertically, which is incorrect.

Version:
Safari Version 8.0.8 (10600.8.9)
OS X 10.10.5

Notes:
WebKit bug: https://bugs.webkit.org/show_bug.cgi?id=148826
Flexbug: https://github.com/philipwalton/flexbugs#9-some-html-elements-cant-be-flex-containers

Configuration:


Attachments:
'testcase.html' was successfully uploaded.

Comments


Please note: Reports posted here will not necessarily be seen by Apple. All problems should be submitted at bugreport.apple.com before they are posted here. Please only post information for Radars that you have filed yourself, and please do not include Apple confidential information in your posts. Thank you!