@deyivis521

Почему h1 выходит за пределы дочери grid-контейнера?

<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;
}
  • Вопрос задан
  • 418 просмотров
Решения вопроса 1
delphinpro
@delphinpro Куратор тега CSS
frontend developer
Во-первых, он не выходит



Во-вторых, нужно точно ставить вопрос



А ответ очевиден как день:
всё потому, что контент не помещается в отведённую область.
Вы же сами написали – 60 пикселей высота шапки.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы