This is a big step in the right direction, but I'm afraid it's still broken. Centering things in this way breaks the <BR> tag. It works inside text but now fails between elements. For example:
foo<br>baz
renders correctly as
foo
bar
but <span>foo</span><br><span>bar</span> renders as foobar.
And AFAICT it doesn't work at all in Safari even with vendor prefixes.
The <br> tag is defined as a tag that inserts a newline with generated content using pre-formatted whitespace. It only works between blocks because of anonymous block element generation. I'm glad that the flexbox spec didn't require some sort of anonymous block element generation; it's really complex as it is and adding anonymous blocks to flexbox would have been hideously complicated.
foo bar
but <span>foo</span><br><span>bar</span> renders as foobar.
And AFAICT it doesn't work at all in Safari even with vendor prefixes.