2 blocks in the middle of container?

Question

Flexbox

Need help.
How to lay out 2 blocks with different background.
Container: 952px The
content stays inside the container block.
Left side one color 300px
Right side another color.
The color of the block goes outside the container, and the client itself must remain inside the container.
I am using flex.

Answer 1

It is possible with a gradient https://jsfiddle.net/m8q024gy/
It is possible with pseudo-elements.