This is possibly the same issue that https://bugs.webkit.org/show_bug.cgi?id=142906 reports but I'm not entirely sure. The issue I am reporting is in relation to 'main-axis' dimensions, specified in percentages, not being honoured when flex-direction: column property/value is used. Here is a reduction http://codepen.io/benfrain/pen/WbqEvL In evergreen browsers such as Firefox and Chrome, you see a red and orange background. In Safari, you only see the orange and the content of the flexbox is collapsed.
Created attachment 381003 [details] Example HTML/CSS reproducing the issue Attached is a sample file reproducing the problem. Children of a flexbox item which is set to flex-direction: column should be 100% wide. They aren't in Safari 13, they are in every other browser. I will also attach a screenshot.
Created attachment 381004 [details] Screenshot comparing test.html in Safari and Firefox Here is the screenshot
Not sure when this was fixed but it is fixed in 15.3/15.4