my sticky navbar is not working

my sticky navbar doesnt seem to work at all. it still gets left at the top of the page. im still new to web development so i only got the javascript from online tutorials. i already tried multiple of them but nothing seems to work at all. here's my code: https://codepen.io/Svenska/pen/BaEdWJE
3 Replies
ἔρως
ἔρως4mo ago
remove the javascript and add this css:
nav {
position: sticky;
top: 0;
}
nav {
position: sticky;
top: 0;
}
by the way, if you want to ensure this only affects the main navbar, you can use body > nav instead
Kevin Powell
Kevin Powell4mo ago
ἔρως is correct, we don't need JS for that. As for why you can't see it, you have a margin-top: -194px on it, so when you're adding the position: fixed, it's going to the top of the page, and then 194 up more from there, and we don't see it. It is fixed, but outside of the viewport. Also, if you do want to use the ID, I'd just move it directly onto the nav. No need to have a div nested in there, we have the nav already 🙂
ἔρως
ἔρως4mo ago
i was thinking the same about the div, but was too lazy at almost 5am