Hi all,
there’s something about the challenges “CSS Grid: Create a Row Gap using grid-row-gap” and " CSS Grid: Create a Column Gap Using grid-column-gap" I don’t quite understand.
It’s not about the solution itself but about the code already there in that challenge.
That’s the code presented:
.container {
font-size: 40px;
min-height: 300px;
width: 100%;
background: LightGray;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr;
/* Only change code below this line */
/* Only change code above this line */
}
Here’s the graphic showing the outcome:
What I don’t understand is, why the graphic shows only two rows. Isn’t the code grid-template-rows: 1fr 1fr 1fr; suppose to create three rows???
Thanks for your help!
Sarah