Bug 83971 - CSS3 Flex and Multi-Column Layout does not scroll X or Y when overflow present
: CSS3 Flex and Multi-Column Layout does not scroll X or Y when overflow present
Status: UNCONFIRMED
Product: WebKit
Classification: Unclassified
Component: New Bugs
: 528+ (Nightly build)
: Unspecified Unspecified
: P2 Normal
Assigned To: Nobody
:
Depends on:
Blocks:
  Show dependency treegraph
 
Reported: 2012-04-13 20:39 PDT by John A. Bilicki III
Modified: 2012-04-26 12:06 PDT (History)
4 users (show)

See Also:


Attachments
Example of flex and multi-column layout where overflow fails to create a scrollbar. (16.37 KB, application/xhtml+xml)
2012-04-13 20:56 PDT, John A. Bilicki III
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description John A. Bilicki III 2012-04-13 20:39:10 PDT
I've attached a test case. The intended purpose of this layout is to be used as an image uploader. The right column for the form with image previews and the left main column a multi-column list of uploaded images on a web server.

In WebKit browsers (using Safari build 7534.54.16) and Chrome there is no scrolling x or y on the left division element regardless of the amount of overflow.

Gecko recently updated how they handle this and in Firefox 13+ (not 12 or older) the left column scrolls vertically (much more desirable) which is what appears to be the case when using autoscroll / middle mouse button in Safari and Chrome as it is possible to partially scroll overflow content that way however this is obviously that overflow content would still obviously be hidden from most people especially non-technical people. This implies that the vertical scrollbar should be displayed though is not.
Comment 1 John A. Bilicki III 2012-04-13 20:56:19 PDT
Created attachment 137196 [details]
Example of flex and multi-column layout where overflow fails to create a scrollbar.
Comment 2 Tony Chang 2012-04-26 12:06:04 PDT
To be clear, this is with the old flexbox (display: -webkit-box).  This should work properly for new flexbox (display: -webkit-flexbox).