Behöver hjälp med att lägga in sticky i min navigation bar
Jag har försökt i flera timmar nu med att försöka olika metoder med att lägga in sticky i min css. Jag har använt mig av olika metoder som t ex att använda mig av <script> för att sedan lägga in javascript. Jag har tyvärr inte fått det att fungera. Finns det någon som kan visa mig hur jag ska göra?
min html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Min hemsida</title>
<link href="css.css" rel="stylesheet" type="text/css">
</head>
<body>
<header>
<div class="container">
<nav>
<ul>
<li><a href="kebab.html">Kebab</a></li>
<li><a href="Pizza.html">pizza</a></li>
<li><a href="hamburgare.html">hamburgare</a></li>
<li><a href="pasta.html">pasta</a></li>
</ul>
</nav>
</div>
</br>
</header>
<h1 class="titel">Titel</h1>
<div class="brödtext">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Nostrum eveniet quod magnam </div>
</body>
</html>
min css:
.container {
width: 100%;
background-color: rgb(136, 18, 130, 0.5);
height: 50px;
}
nav {
float: right;
}
nav li {
display: inline-block;
margin-right: 300px;
}
nav a {
text-decoration: none;
text-transform: uppercase;
font-size: 30px;
color: rgb(0,0,0);
}
.sticky {
position: fixed;
top: 0;
width: 100%;
}
.titel {
background-color: green;
display: inline-block;
margin-right: 300px;
}
