Отступ вверху страницы

223

30 апреля 2018, 22:38

Только начал изучение верстки и не могу найти ответ. В стилях обнулил отступы margin и padding для тега body, но сверху страницы остался отступ. Для наглядности покрасил body в красный цвет. Откуда он берется? Отступ исчезает если в header написать padding: 1px;

body { 
	font-family: Open Sans, sans-serif; 
	margin: 0; 
	padding: 0; 
	background-color: red; 
} 
 
header { 
	background-color: #f6f2f1; 
	height: 770px; 
    /*padding: 1px;*/ 
} 
 
.container { 
	width: 1250px; 
	margin: 0 auto; 
} 
 
div { 
	box-sizing: border-box; 
} 
 
nav { 
	height: 90px; 
	background-color: #312f30; 
} 
 
li { 
	display: inline; 
} 
 
li a { 
	color: #e0e0e0; 
	text-decoration: none; 
	text-transform: uppercase; 
}

<!DOCTYPE html> 
 
<html> 
<head> 
	<title>Первая верстка</title> 
	<meta charset="utf-8"> 
	<link rel="stylesheet" type="text/css" href="D:\Верстка\css\style.css"> 
</head> 
<body> 
	<header> 
		<div class="container"> 
			<nav> 
				<ul> 
					<li><a href="#">home</a></li> 
					<li><a href="#">portfolio</a></li> 
					<li><a href="#">about us</a></li> 
					<li><a href="#">contact</a></li> 
				</ul> 
			</nav> 
		</div> 
	</header> 
	<section> 
		<div class="container"> 
		</div> 
	</section> 
	<section> 
		<div class="container"> 
		</div> 
	</section> 
	<section> 
		<div class="container"> 
		</div> 
	</section> 
	<section> 
		<div class="container"> 
		</div> 
	</section> 
	<footer> 
		<div class="container"> 
		</div> 
	</footer> 
</body> 
</html>

Answer 1

Открываем DevTools ("Просмотр кода страницы" или ctrl+shift+i), с начала и до конца просматриваем элементы, и находим ul, у которого margin-top: 16px - это и есть наш отступ.

http://joxi.ru/xAebeMqtYzO78r