This is the real answer. If you haven't yet embraced Flexbox then do yourself a favor and get on board, it's awesome.
I'm in the midst of a (long, long overdue) redesign on the principle site I maintain, and just discovered flexbox. It's kind of jaw-dropping how much simpler it makes everything. Flexbox plus box-sizing: border-box allowed me to solve in about fifteen minutes layout problems that had previously taken me a few days and poking and Googling and cursing.
Yup! I made flexboxpatterns.com, which contains many examples related to centering. Flexbox + PostCSS for cross-browser support and you're good to go.
I have checked your work out, I like it. Go further.....there's a real opportunity for someone to build deep and wide Flexbox development tools, which just don't exist right now.
How about also including ie9 fallbacks?
Whoa! Nice job!
That's one of the results that is returned if you select a version of IE that supports flexbox.
And since IE10 is EOL, it is fair to drop support for that.
I am in the enviable position of being able to say "Not using a modern browser, sorry, my site is not for you. Upgrade to a latest browser or leave."
That does make using Flexbox a whole lot easier.
Having said that, Bootstrap 4 has optional Flexbox.
I'm completely on board with ignoring IE at this point. Even Microsoft is through with it. With its declining market share and quickly expiring install base (Vista kicks the bucket next year, 7 in 2020) the benefit of mangling my codebase to support the dying browser just isn't worth the cost to me anymore.