Style The Sidebar

Let’s add some colors to our side bar.

First, we’ll add a background-color, and a font color. In styles.css add the following:

  aside {
    background-color: #282C34;
    color: #F6CE30;
  }

Our links are blue and underlined because that is the default styles from the browser. Let’s add fix our CSS so our anchor tags look exactly how we want them to.

Open up styles.css

aside ul li a {
  font-size: 28px;
  color: #F6CE30;
  cursor: pointer;
  font-family: 'Bungee', serif;
}

This CSS will style only anchor tags, inside of list items, inside of an unordered list inside the aside.

Let’s give styles.css a save and refresh our page.

Up next, let’s style our <main> to match the rest of our page.