flexbox expected size
Please see the above picture. This is a flexbox styled 3 cards in a row. But when i resize to the smaller screens the left and right cards cut off from both sides as shown in picture below.
enter image description here

Please note that i am only using pure html and CSS here.. no javascript

I have defined the width and height in px. And width 100% is also set. If i don’t define the overflow-x: auto; the cards flow out of the viewports and mess up. Pease tell me what am i doing wrong here?