Use CSS3 in applications - Programming in HTML5 with JavaScript and CSS3 - page 284

The full code listing is specified here:
html, body {
height: 100%;
width: 100% ;
}
#blogPage {
display: grid;
columns: 15% 1fr 25%;
grid-rows: 20% 20% 20% 20% 20%;
width: 90%;
height: 95%;
border: 1px dotted black;
margin: auto;
}
#blogPage > header {
grid-column: 1;
grid-column-span: 3;
grid-row: 1;
border: 1px dotted black;
}
#blogPage > footer {
grid-column: 1;
grid-row: 5;
grid-column-span: 3;
border: 1px dotted black;
}
#blogPage > article {
grid-column: 2;
grid-row: 2;
grid-row-span: 3;
border: 1px dotted black;
}
#blogPage > #calendar {
grid-column: 3;
grid-row: 3;
border: 1px dotted black;
}
#blogPage > #blogRoll {
grid-column: 3;
grid-row: 4;
border: 1px dotted black;
}
#blogPage > #aboutMe {
grid-column: 1;
grid-row: 2;
grid-row-span: 3;
border: 1px dotted black;
}