UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_4) AppleWebKit/601.5.17 (KHTML, like Gecko) Version/9.1 Safari/601.5.17
Example URL:
http://codepen.io/juwain/pen/GobrVG?editors=1100
Steps to reproduce the problem:
1. Create flex-conteiner and put some flex-items in it. Items should be on one line in flex-container.
2. Set min-height and flex-basis to flex-items.
3. Set flex-wrap: wrap and align-content: flex-end to container.
What is the expected behavior?
Align-content property must align flex-items even there is only one line in flex-container with flex-wrap: wrap.
What went wrong?
Align-content property starts working when there are 2 or more lines of items in flex-container.
Does it occur on multiple sites: Yes
Is it a problem with a plugin? No
Did this work before? Yes https://bugs.chromium.org/p/chromium/issues/detail?id=324178
Does this work in other browsers? Yes
Chrome version: 575538bc320e213510be1e66f3521382e615129d-refs/branch-heads/2623@{#657} Channel: stable
OS Version: OS X 10.11.4
Flash Version: Shockwave Flash 21.0 r0
http://lists.w3.org/Archives/Public/www-style/2014Oct/0489.htmlhttps://www.w3.org/TR/css-flexbox-1/#change-201409-align-content-wrapping
Spec has changed. Now align-content depends not on number of lines in flex-container, but on flex-wrap: wrap property only!
Reopening because this got reverted a little while ago. Before relanding, look into bug 634672 and bug 641789 and make sure they are working as intended.
Still getting bit by this: https://codepen.io/anon/pen/GEQmGx
When the viewport is small enough, scrolling down doesn't extend the backgrounds of .a and .b like it should.
I can confirm this is still happening.
"align-content: center" does not do anything in a flexbox with "flex-wrap: wrap" in both Chromium and WebKit.
It works fine in Firefox and Edge.
So, the previous patch for this caused bug 641789 because we lay out the flex item as fit-content but align it as max-content, which does not work well...
Comment 1 by zyuzin.v...@gmail.com
, Apr 1 2016