Как затянуть шапку на всю ширину экрана?
Bот код HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="style/style.css">
</head>
<body>
<header>
<nav>
<button class="nav men-btn1">Домой</button>
<button class="nav men-btn2">Чат</button>
<button class="nav men-btn3">Проекты</button>
<button class="nav men-btn4">Приколы</button>
<button class="nav men-btn5">Информация</button>
</nav>
</header>
<main>
</main>
<div class="menu">
</div>
<footer>
<div class="footer-info">
<p><a href="">Все права зашищены.</a><a href="">Контакты</a><p class="cop">Copyrighting ©2008-2020</p><br><p class="authors">Автор: Klaver</p></p>
</div>
</footer>
</body>
</html>
CSS:
header {
background: silver;
position: relative;
display: block;
width: 100%;
height: 120px;
margin-bottom: 40px;
}
nav {
text-align: center;
}
.nav {
padding: 13px 30px 10px;
background: white;
border-top: none;
outline: none;
cursor: pointer;
}
main {
background: white;
margin-left: 15%;
width: 60%;
height: 1000px;
border-top: 1px solid gray;
border-right: 1px solid gray;
margin-bottom: 40px;
}
.menu {
background: white;
width: 20%;
height: 1000px;
margin-right: 2%;
margin-top: -1042px;
float: right;
border-top: 1px solid gray;
border-left: 1px solid gray;
margin-bottom: 40px;
}
footer {
background: silver;
widows: 100%;
height: 80px;
box-shadow: 0 0 5px black;
}
.footer-info {
text-align: center;
}
.cop {
margin-top: -7px;
}
.authors {
margin-top: -22px;
}
