RESOLVED CONFIGURATION CHANGED 172262
CSS Flexbox, flex-wrap property not working 
https://bugs.webkit.org/show_bug.cgi?id=172262
Summary CSS Flexbox, flex-wrap property not working
Dani Akash S
Reported 2017-05-17 23:43:07 PDT
flex-wrap property is not working for two <div> elements inside a flexbox. It is not wrapping the div to new row even if the viewport size is not enough to display the two contents. Refer the following page: https://daniakash.github.io/safari-webkit-flexbox-bug/ If the page is resized horizontally, the second <div> is not being wrapped to a new line. Source code for the above website is available at - https://github.com/DaniAkash/safari-webkit-flexbox-bug Screenshots of the website in: * chrome - https://raw.githubusercontent.com/DaniAkash/safari-webkit-flexbox-bug/master/images/chrome.png * safari - https://raw.githubusercontent.com/DaniAkash/safari-webkit-flexbox-bug/master/images/safari.png Tested it with Safari 10.0 and 10.1 on mac and Safari browser on iPhone with iOS version 10.1.1
Attachments
Add attachment proposed patch, testcase, etc.
Brent Fulgham
Comment 1 2022-07-15 11:10:55 PDT
Safari, Chrome, and Firefox seem to show identical behavior during resize. Do all browsers have a bug here?
Brent Fulgham
Comment 2 2022-07-15 11:11:24 PDT
Given the age of this bug, I'm going to RESOLVE as WORKSFORME, but please REOPEN if you believe there is an ongoing issue.
zalan
Comment 3 2022-07-15 11:41:57 PDT
(In reply to Brent Fulgham from comment #1) > Safari, Chrome, and Firefox seem to show identical behavior during resize. > Do all browsers have a bug here? No, it's just you can't make the window size narrow enough to force wrapping on macOS. It works fine in responsive design mode when a small (narrow) enough device is selected. I am going to go with config change here.
Note You need to log in before you can comment on or make changes to this bug.