Bug 233263 - When all elements in flexbox main axis are flexed, there should be no overflow in that axis.
Summary: When all elements in flexbox main axis are flexed, there should be no overflo...
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 14
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2021-11-17 10:46 PST by Nige White
Modified: 2022-10-27 23:23 PDT (History)
6 users (show)

See Also:


Attachments
Bug page (1.54 KB, text/html)
2021-11-17 10:46 PST, Nige White
no flags Details
Screenshot of the problem (141.00 KB, image/png)
2021-11-23 06:59 PST, Nige White
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Nige White 2021-11-17 10:46:48 PST
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.
Comment 1 Nige White 2021-11-23 06:59:37 PST
Created attachment 445028 [details]
Screenshot of the problem
Comment 2 Radar WebKit Bug Importer 2021-11-24 10:47:20 PST
<rdar://problem/85731339>
Comment 3 Ahmad Saleem 2022-10-27 14:00:14 PDT
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!
Comment 4 Nige White 2022-10-27 23:04:38 PDT
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.
Comment 5 Nige White 2022-10-27 23:23:24 PDT
This is the Chromium report: https://bugs.chromium.org/p/chromium/issues/detail?id=1270275