помогите разобрать ошибку html + css

web.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>geometry</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<li><a href="">n1</a></li>
<li><a href="">n2</a></li>
<li><a href="">n3</a></li>
<li><a href="">n4</a></li>
</header>
</body>
</html>
style.css
header{
width: 960px;
margin: 0 auto;
}
header: before{
content:'';
display: block;
height: 50px;
width: 100%;
background: blue;
position: absolute;
left: 0;
z-index: -1;
}
ul{
margin: 0;
padding: 0;
list-style: none;
height: 50px;
}
ul li{
float: left
}
ul li a{
color: black;
display: block;
height: 50px;
padding: 0 30px;
text-transform: uppercase;
text-decoration: none;
line-height: 50px;
}
ul li a:hover{
background: red;
}
26 января 2019 в 12:44