Okay so I did find an answer, but that gives a new place for a bug.
The "solution" is:
https://jsfiddle.net/aL5ta60b/2/
Which centers the red div, and centers it's content. Fantastic.
The problem is. Notice the width: 600px
. It doesn't react on that. I mean it does, but it doesn't force it to 600px. It's actually hard to explain what it does, it behave like I size it by % rather than by px. Try to play with size of editor to find out what I mean. It is meant to forcefully push red div to the right, and green to take whatever is free.
Edit: Found it! flex: 0 0 400px;
I knew there was a good way to do it, thanks.