Html5 and css3 grids

I was coding along with Mosh and I encountered an issue in the HTML/CSS course part 2, Layout section and Grids lesson.
After typing in the same code in VScode, I noticed that my grids were not separated by any margin whereas Mosh’s were.
I tried adding a margin to the boxes and I am getting a totally different thing. Did anyone stumble into this issue? If yes how did you solve it?
I need your help.

The white space between the yellow boxes is not a margin. It’s there because the yellow boxes are smaller than the grid cells.

Mosh gives the grid cells absolute sizes of 100 pixels and the boxes a width and height of 5rem which by default leads to a 80x80 pixels size. If you don’t see the resulting 20px white space I’d say either your code or your root font size is different.

1 Like

Thanks a lot Sam. That was helpful. I appreciate

Am new to programming. I am having this problem as well. How do I change the default settings and make the box stretch to the grid size?