Overflow Scrolling troubles.

Question

I can’t seem to get the scrolling to go all the the way to the top of the outer box. The first inner box gets cut off and I can’t scroll up further.
Any way to fix this?
https://code.sololearn.com/WziqdC64vS0D/?ref=app

Answer 1

Morpheus like this?
https://code.sololearn.com/WL0Sci9BU60W/?ref=app

Answer 2

I guess when using space around in flex then the overall length of the items should be lesser than the container to make some space for the space-around.

justify-content:space-around;

Therefore disabling this one works,

Although I would love to see a solution where space-around works with overflow: scroll
would appreciate a better answer though.

Answer 3

Just remove the flexboxing

Answer 4

or remove the justify-content

Answer 5

Thanks Toni Isotalo Morpheus Gordon for the response, I had no idea it was a flexbox issue, I think gordon got it just right(with space-around). Way to think outside of the box, pun intended.

Answer 6

This way of using an outer container, I learned from Calvin~ when he solved my shadow problem:
https://www.sololearn.com/discuss/1623726/?ref=app