Getting rid of white space between divs


I am using css grid for this project, and between some of the grids (div) there is white space on it. I am trying different things that I saw on the web but with no success. This is the project:

Removing height from some of the div does not work either, and for some reason makes the divs height bigger and the white space seems to disappear, although reapers if I squeeze the page (testing responsiveness):

any hints in what could be wrong

I’m not too sure, but you do have your grid-gap set to .3em. Setting the grid-gap to this may be causing the whitespace between the divs in the grid (if this is what you were asking?)

if you look at the second image between the box with an image of athletes running and box number 4 there is big white space. the grid-gap is set to .3rem, so very small

Ooh. Ok, sorry! I’m not too sure in that case…

shall I remove the height set for each div ?