title: Vertical Navbar/Sidebar align elements centered
body: <p>I am trying to build a sidebar with centered vertical elements like this design:</p>
  
  <p><a href="https://i.stack.imgur.com/jOxAT.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jOxAT.jpg" alt="enter image description here"></a></p>
  
  <p>I couldn't figure it out after 2 hours so I decided to ask you guys if somebody could help me since I can't find any good links that can provide helpful information.</p>
  
  <p>I think I am doing something wrong in the following <code>sidenav</code> class:</p>
  
  <pre><code>.sidenav {
      overflow: auto;
      font-family: verdana;
      font-size: 12px;
      font-weight: 200;
      background-color: #16191C;
      position: fixed;
      top: 0px;
      width: 150px;
      height: 100%;
      color: #e1ffff;
  }
  </code></pre>
  
  <p>Check <a href="https://jsfiddle.net/tdaeh7yu/1/" rel="nofollow noreferrer">JsFiddle</a>.</p>