How to arrange elements with a width of 100% on the same line in a fixed container?

Question

css

I have a fixed width container with overflow: scroll. It has several blocks with a width of 100%. How to arrange these blocks on the same line?
Tried float: left and display: inline-block - doesn't work, because elements do not fit on one line. I tried flex, which I'm still new to, the first two DIVs don't display correctly. How to solve this problem?
Not working example on flex: https://jsfiddle.net/hnvxf0yc/

Answer 1

remove .wrapper style justify-content: center; ?