| Summary: | When all elements in flexbox main axis are flexed, there should be no overflow in that axis. | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Nige White <nige.animal> | ||||||
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> | ||||||
| Status: | NEW --- | ||||||||
| Severity: | Normal | CC: | ahmad.saleem792, bfulgham, simon.fraser, svillar, webkit-bug-importer, zalan | ||||||
| Priority: | P2 | Keywords: | InRadar | ||||||
| Version: | Safari 14 | ||||||||
| Hardware: | Unspecified | ||||||||
| OS: | Unspecified | ||||||||
| Attachments: |
|
||||||||
Created attachment 445028 [details]
Screenshot of the problem
I am still able to reproduce this bug in Safari 16.1 and on certain heights from slider, it does show "vertical" scrollbar and so does "Chrome Canary 109", I am not able to reproduce this in Firefox (it could be due to -webkit- prefixes) but moving slider does not show "vertical scrollbar" though. Just wanted to share updated results. Thanks! I think Firefox have fixed it. I cannot find any container height which produces a scrollbar on Firefox. I cannot find the original bug report I filed with them. Searching for "flexbox" and "overflow" and "scrollbars" shows a lot of bugs being fixed though. Chrome still shows a scrollbar at certain heights. 601.23px for example. This is the Chromium report: https://bugs.chromium.org/p/chromium/issues/detail?id=1270275 |
Created attachment 444536 [details] Bug page Ensure scrollbars are visible if you use OSX. Using the attached HTML file, you can adjust the height of the '.container' element in 0.01px increments using the slider. At just a few particular heights, a vertical scrollbar appears. Given that all the elements in the vertical flexbox are flex-grow:1 and flex-basis:0%, and do not violate any minHeight constraints, there should be no overflow. Regardless of the maths involved and remainders after calculation of the child heights, requesting that all children are flexed, and no height constraints implicitly specifies that there should be no vertical overflow. I have currently found height 600.47, but there are many other "breakpoints" where it creates overflow.