Sidebar experiment

by ShaCP

HTML

<div class="container">
<div id="sidebar"></div>
  <div id="top">
    <p>Hello?</p>
  </div>
</div>

CSS

#sidebar {
  height: 100vh;
  width: 25%;
  padding-top: 15px;
  background: #000;
  margin: -8px 0 -8px -8px;
}

.container {
  display: flex;
}

a:visited {
  color: grey;
}

a:hover {
  background-color: white;
  /**Top, Right, Bottom, Left for Padding*/
  padding: 10px 100% 5px 0px;
}

a:link {
  text-decoration: none;
}