<body>
<header>
<h1>Заголовок</h1>
</header>
<main>
Main
</main>
<aside>
Aside
</aside>
<footer>
Footer
</footer>
</body>body {
padding: 0 10px;
display: grid;
grid-template-areas:
"header header"
"main aside"
"footer footer"
;
grid-template-rows: 60px 1fr 60px;
grid-template-columns: 1fr 15%;
grid-gap: 10px;
height: 100vh;
margin: 0;
}
header, main, aside, footer {
padding: 10px;
background: gold;
}
header {
grid-area: header;
}
main {
grid-area: main;
}
aside {
grid-area: aside;
}
footer {
grid-area: footer;
}
Простой
Средний
Средний