Here's the page: http://output.jsbin.com/renoyijadu/1
I have a layout similar to the one I created in the JSbin above. You can notice (also in the preview), if you open it in a full page and then reduce the browser width, at a certain point the top row is going to exceed the page top (i'm using the newest chrome).
I do have overflow-y set, so I can scroll down to see the bottom rows if they're hidden, but the top row is still cut off.
Why is this happening? Is there a way to fix this, or is flexbox broken when wrap is used?
As pointed out, this is similar to Can't scroll to top of flex item that is overflowing container, but the answer there quotes: "However, if you're trying to replace justify-content with margin-based centering in a multi-line flexbox, you're probably out of luck, as you need to put the margins on the first and last flex item on each line. Unless you can predict ahead of time which items will end up on which line, you can't reliably use margin-based centering in the main axis to replace the justify-content property.", meaning there's no solution for my case.
If someone does know a solution (that's a year old question, maybe there's something new since then), that would be great.
