ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
position: fixed;
top: 0;
width: 100%;
z-index: 9;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 16px 16px;
text-decoration: none;
}
li a:hover {
background-color: #111;
color: #2EFE2E;
}
.content {
width: 100%;
position: relative;
float: left;
padding-top: 40px;
}
<div class="navbar">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="enemies.html">Enemies</a></li>
<li><a href="">Video</a></li>
</ul>
</div>
<div class="content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent imperdiet diam nibh, vitae viverra libero ultricies nec. In elementum finibus luctus. Nulla diam odio, fringilla vitae cursus vestibulum, porta lacinia eros. Etiam ultricies lobortis
ipsum, quis tristique massa viverra eget. In eget auctor magna. Integer bibendum ligula quis felis consequat, non tempor sem volutpat. Integer accumsan, neque in aliquam egestas, dolor est facilisis velit, convallis malesuada nisl arcu at metus. Duis
sed rutrum ipsum, vel convallis risus. Duis rhoncus mi ut odio elementum, ut tincidunt nibh malesuada. Aliquam maximus sapien auctor ante cursus, non pretium est varius. Donec ac mi maximus, sodales ipsum vitae, ornare eros. Sed at pulvinar turpis.
Aliquam tortor nunc, vehicula at laoreet id, ullamcorper et libero. Ut vitae euismod est, nec lacinia ligula. Curabitur ornare felis id quam semper, ac consectetur metus facilisis. Integer mollis luctus arcu sed dignissim. Phasellus tincidunt, lorem
gravida efficitur commodo, risus neque facilisis odio, nec viverra ligula arcu ut tortor. Cras sit amet porta orci. Pellentesque sed nibh metus. Mauris id justo nec erat efficitur molestie. Donec pulvinar, enim nec mollis placerat, mauris erat vestibulum
ex, quis sagittis dolor lacus in nibh. Nulla vel egestas nunc. Proin ut nulla tincidunt, placerat nibh id, ornare lorem. Integer nunc est, vulputate sit amet tempus eu, vulputate id mauris. Sed congue tortor id diam aliquet eleifend. Orci varius natoque
penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum quam eu ex gravida, sed aliquet urna sodales. Aenean congue nisi sed eros aliquet, et sagittis nisl bibendum. Curabitur consectetur, massa ac suscipit vestibulum, sapien
dui pellentesque lorem, et cursus sapien lectus et risus. Duis cursus aliquet tristique. Quisque orci leo, rutrum eu lorem vitae, consequat luctus tortor. Morbi a elit augue. Maecenas et libero sed ligula aliquet cursus. Phasellus in sapien id lorem
sagittis interdum. Suspendisse non luctus sem. Sed vestibulum mi nec orci fermentum, suscipit mattis mi ornare. Ut et nulla commodo, lobortis elit non, molestie diam. Nam a ante fermentum, lobortis odio ut, porta tortor. In vel tempor leo, non hendrerit
tellus. Mauris non rutrum turpis, vel gravida turpis. Quisque iaculis lectus vitae magna congue, sed imperdiet lectus dictum. Ut et dolor ut lacus fringilla molestie a vel ipsum. Maecenas nec malesuada ex. Maecenas efficitur semper lacinia. Morbi
varius elementum feugiat. Aenean quis pellentesque eros. Ut quam arcu, blandit non eros et, mattis malesuada nulla. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis accumsan tristique molestie. Vivamus rhoncus arcu eget euismod varius.
Fusce purus urna, semper vitae orci vitae, cursus facilisis tellus. Quisque laoreet commodo quam eu consectetur. Proin ligula felis, rutrum nec neque quis, scelerisque lacinia erat. Aliquam tortor leo, volutpat accumsan mollis sit amet, tristique
sit amet lacus. Maecenas imperdiet nibh vitae laoreet tempor. Nulla viverra, nulla ut luctus aliquam, erat nisi accumsan quam, vitae efficitur velit dolor fermentum felis. Sed nec lorem non lectus pellentesque dictum.</p>
</div>