Steps to reproduce: Put select element inside flexbox and apply some "pressure": https://jsfiddle.net/Risord/dvky8w4m/4/ Actual results: Select will be collapsed all the way zero height (in demo there is a bit more space so that select is easier to see). Expected results: Select should keep it's "obvious" height just like the div (and other form inputs etc.). Chrome and Edge also handle select correct way. This very same issue has been reported (and fixed) on firefox at : https://bugzilla.mozilla.org/show_bug.cgi?id=1591925 Chrome doesn't have this issue. This is tested by the following WPT tests (that fail on WebKit): https://wpt.live/css/css-flexbox/select-element-zero-height-001.html https://wpt.live/css/css-flexbox/select-element-zero-height-002.html
There is a problem in the tests.
Created attachment 442006 [details] Patch
WPT also confirms they're working fine https://wpt.fyi/results/css/css-flexbox?label=master&label=experimental&product=chrome&product=edge&product=firefox&product=webkitgtk&aligned
<rdar://problem/94158795>
We show this as a failure in STP 146. Is this a Safari-only issue we are having?
https://wpt.fyi/analyzer?screenshot=sha1%3A7c46f91fa7586a0036094866a706ac1f220f14eb&screenshot=sha1%3A2d1204d50c43764eeae10692c176aa39fdd7ccfa this being a few pixels makes me wonder if it's related to intrinsic margins on form elements? it's 1 pixel off vertically, which suggests it is something else, though the height of the select element seems right.
Intrinsic margins were removed (https://github.com/WebKit/WebKit/pull/3205), and this isn't fixed.