TEMPLATERR

Copy-paste the following into the bottom of all applicable stylesheets:


nav{
  z-index: 99;
  background-color: yellow;
  position: absolute;
  padding: 10px;
  height: 100%;
  width: 120px;
}

.navlink{
  background-color: white;
  display: block;
  padding: 5px;
  margin: 8px 5px 8px;
}

Now, I don't know if you noticed, but as-is this is a really ugly sidebar. PLEASE change the width, height, colors, link styling, outline, and other settings to taste.

In order to keep the sidebar from overlapping your page content, you will probably need to add this line to the body CSS:


left-margin: 120px; //replace 120px with whatever width you made your sidebar

Or, if you're using auto margins, these two:


position: relative;
left: 120px; //replace 120px with whatever width you made your sidebar

SIDEBAR