How to wrap a grid

…I have a grid container with max-height 100px and with only 2 rows, but whenever I add more divs in the container it overflows (creates a third, fourth, etc) outside of the grid container. Is there way to prevent this? Is there property akin to flex-wrap for display grid?

.grid_container {
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
max-height: 100px;

.grid_box {
width: 4vw;
height: 4vh;

Hi Jason,
could you post a codepen or jsfiddle that recreates the issue?

Thank you for trying, I solved it by creating a function that removes the last node whenever the number of divs goes beyond the last row.


grid-auto-rows: 100px;