Let's try to understand what is a grid item by looking at the below code.
HTML:
In the above code we could see the div with the container class is
parent to the div with the class of item1
, item2
and item3
. Now when
we apply display: grid
property to the parent div, then it becomes the
grid container and the child items are called grid item.
So, basically a grid item is the child or direct descendants of a grid
container.
Grid items can also be controlled by applying css grid properties to them
individually. In the above example we applied the below css to the individual
items.