body {
display: grid;
grid-template-areas: "header header" "nav article ";
grid-template-columns: 200px 1fr;
margin: 0;
}
header,
footer,
article,
nav,
div {
padding: 20px;
background: gold;
}
#pageHeader {
grid-area: header;
}
#mainArticle {
grid-area: article;
}
#mainNav {
grid-area: nav;
}
<header id="pageHeader">Header</header>
<article id="mainArticle">Article</article>
<nav id="mainNav">Nav</nav>
Как сделать чтобы nav
и article
автоматически растягивались на оставшуюся высоту окна?
html && body
нет высоты, задай им высоту – Air 14 июл '20 в 3:15