
.grid {
display: grid;
grid-template-columns: repeat (3, 1fr);
grid-template-rows: 30% 200px auto;
grid-gap: 1em;
}

.grid > * {
display: flex;
align-items: center;
justify-content: center;
}

header {
background: lightgreen;
padding: 1em; 
}

footer {
background: lightpink;
padding: 1em;
}

nav,
article,
aside {
background: lightblue;
padding: 1em;
}

header, footer {
grid-column: 1 / 4;
}

article {
min-width: 15em;
}