[Webkit-unassigned] [Bug 136041] Safari (WebKit) doesn't wrap element within flex when width comes below min-width

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=136041

Mikol Graves <mikol at thinbox.org> changed:

           What    |Removed                     |Added
----------------------------------------------------------------------------
                 CC|                            |mikol at thinbox.org

--- Comment #2 from Mikol Graves <mikol at thinbox.org> ---
See also:

* http://codepen.io/anon/pen/qEKwXX (Does not work as expected.)
* http://codepen.io/anon/pen/yyqLGr (Works around actual behavior.)
* https://github.com/angular/material/issues/1720 (Resulting Angular Material issue.)

Steps to Reproduce:
1. Create a container with CSS declarations `-webkit-flex-direction: row; -webkit-flex-wrap: wrap;` and three child elements.
2. Each child should include the CSS declarations `-webkit-flex: 1; min-width: 320px;`.
3. View the page with Safari on OS X (10.9.5) or iOS (I used 8.x on both a real and simulated iPhone 6).


Expected Results:
Each child element should shrink to its minimum width as the viewport gets narrower and wrap as the viewport becomes narrower than their combined minimum width.

Setting `flex: 1 1 320px` achieves the expected results.

Actual Results:
The child elements shrink to their mnimum width when the viewport width is narrow, but they do not wrap.

User Agent: 
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_5) AppleWebKit/600.3.18 (KHTML, like Gecko) Version/7.1.3 Safari/537.85.12

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20150304/4b1bb303/attachment-0002.html>