This came up in a Stack Overflow question where flex container contents were floating center when `align-self: flex-end` was set on the child in Safari 9 (1). Turned out that it was align-content: center causing the problem. According to the align-content spec, there should be no effect on a single-line flex container (2). That seems to be the case in other browsers. So the bug is that align-content is having an effect when it shouldn't there. Example cleaned up from SO here for review: http://codepen.io/alexbea/pen/KzBXQJ (1) http://stackoverflow.com/questions/36770602/safari-9-flexbox-align-self-flex-end-doesnt-work (2) https://www.w3.org/TR/css-flexbox-1/#align-content-property
<rdar://problem/29695099>
The codepen is gone, so not sure how to test.
Move to INVALID due to insufficient info.
I was doing some Codepen account cleanup and accidentally deleted it. I've reproduced it: https://codepen.io/alexbea/pen/RpaNQq
Created attachment 395204 [details] Single file demo of the problem I'm attaching this demo in case the Codepen demo disappears again.
I'm afraid I can't see any difference between Safari 15.4 (Beta) and Chrome on this test page. I suspect that this (along with a number of other flex bugs) have been fixed since this was originally filed. Could you please REOPEN if this is still an issue, and perhaps help me understand what I missed when I looked at the test case?