CSS, alguem me explica pq o float usado no menu dependendo do tamanho do texto faz o texto cortar?

CSS

HTML5

21/08/2019

html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Musculação</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<header id="header">
<h1>Anime Aqui</h1>
<nav>
<ul>
<li><a>Home</a></li>
<li><a>Noticias</a></li>
<li><a>Lista de animes</a></li>
</ul>
</nav>
</header>
<main>

</main>
<footer></footer>

</body>
</html>
---------------------------------CSS-----------------------------
#header{
background-color: rgba(0, 0, 0, 0.479);
height: 100px;
}
body{
margin: 0%;

}
#header h1{
float: left;
}
#header nav{
float: right;
}
#header nav ul li{
display: inline-block;
width: 60px;

}
Allan Brandão

Allan Brandão

Curtidas 0
POSTAR