scrimba
CSS Grid
Template areas - CSS Grid tutorial
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

To see this lesson you need to be logged in. Joining Scrimba is free and gives you access to 20+ courses.Sign up
Template areas - CSS Grid tutorial
AboutCommentsNotes
Template areas - CSS Grid tutorial
Expand for more info
index.css
run
preview
console
.container {
height: 100%;
display: grid;
grid-gap: 3px;
grid-template-columns: repeat(12, 1fr);
grid-template-rows: 40px auto 40px;
}

.header {
grid-column: 1 / -1;
}

.menu {}

.content {
grid-column: 2 / -1;
}

.footer {
grid-column: 1 / -1;
}
Console
index.html
-4:48