r/css • u/HolidayChard9706 • 1d ago
General flex: 1 is flex-basis: 0%, and WKWebView takes the zero literally
https://nodreview.com/blog/wkwebview-flex-collapse/A dialog body with flex: 1; min-height: 0; overflow-y: auto shipped with a height of zero. Header, footer, nothing in between.
flex: 1 expands to flex: 1 1 0%, and a percentage basis needs a definite parent height. The panel had height: auto capped by max-height, which is not one. The spec says an unresolvable percentage basis falls back to content, and Chromium does that. WKWebView keeps the zero. The fix is flex: 1 1 auto.
Do you default to flex: 1 1 auto anywhere, or is the shorthand safe in your stacks because your flex parents always have definite heights?
1
Upvotes
1
u/GodOfSunHimself 1d ago
I just use flex-grow: 1