CSS grid stacking elements vertically when browser hits a certain width

CSS grid stacking elements vertically when browser hits a certain width
0

#1

I am trying to use CSS grid to build a photo library’s frontend.
I am running into the issue that if I resize my browser to a certain width, the child element will spill out of the parent element which I set it as display: grid;

in the example I gave you above you can try to resize the window width.
how do I fix this?
I want those child elements stacked up vertically when browser becomes too narrow.
is there any way I can do this only using css grid? or I have to use media query/


#2

Using repeat with auto-fill, maybe?


#3

Remove this:

*{
	min-width: 480px;
	box-sizing: border-box;
}

#4

wow thanks!!! (20 character)