188252 2018-08-01 23:18:53 -0700 Flexbox auto width flex container wraps when not necessary 2020-08-18 10:12:27 -0700 1 1 1 Unclassified WebKit Layout and Rendering Safari 11 Unspecified macOS 10.13 NEW InRadar P2 Normal --- 1 roland webkit-unassigned bfulgham jonlee sdemjanenko simon.fraser webkit-bug-importer zalan oldest_to_newest 1447192 0 roland 2018-08-01 23:18:53 -0700 I have a complicated flexbox layout where menu items are columns and aligned to the right in an auto width flexbox container. Also This container allow the items to wrap when there is not enough width available. You can check the issue here: https://smartslider3.com/bugs/webkit/flexwrap/ Safari 11.1.2 and Tech preview Release 61 (Safari 12.0, WebKit 13606.1.25.1): https://i.imgur.com/xnrQyGE.png Chrome and other browsers: https://i.imgur.com/bDVDk7j.png I tried to compose the issue in JSFiddle, but I have no luck, it seems fine in Safari too: http://jsfiddle.net/j3Lau0td/1/ I think the issue is somehow related to value rounding. In the original example if you check .n2-ss-layer-row-inner element, which has the following CSS: width: calc(100% + 30px); margin: -15px; You just need to change that to and it seems OK in Safari too. width: calc(100% + 31px); margin: -15px; 1452562 1 webkit-bug-importer 2018-08-22 01:46:15 -0700 <rdar://problem/43597279> 1681114 2 sdemjanenko 2020-08-18 10:12:27 -0700 I believe this bug is also causing an issue when using nested Grid component's in Material-UI: https://github.com/mui-org/material-ui/issues/17142 Is there any priority to address this bug?