Recreating cnn taskbar

Recreating cnn taskbar


I’m trying to recreate If you visit the website you’ll notice that the taskbar at the top remains visible even if you scroll down. How do I recreate that effect?


The effect is called a sticky header. It can be done by giving the element a position of fixed and pinning it to the top of the screen, like so:

nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;