title: Foundation Side Navigation Trouble
body: <p>I am having trouble with Side Navigation, see <a href="http://codepen.io/anon/pen/emmWMP" rel="nofollow">codePen</a>. With Foundation 5 example, I tried to put blue label on sides (side1, side2, side 3, etc) to be same level with first label (My Site), I add padding-top, padding-down, and something else that are not working. I would be greatly appreciate of your help to set side navigation and proper text center with less space between. </p>
  
  <p>CSS</p>
  
  <pre><code>.topside-nav li {
    display: inline-block;
    line-height: 15px;
    font-size: 1.25rem; 
    padding-right: 2.25rem;
    margin: -60px 2px 5px 60px;
    text-align: center;
  }  
  </code></pre>
  
  <p>Foundation - <a href="http://foundation.zurb.com/docs/components/sidenav.html" rel="nofollow">Side Nav</a></p>
  
  <p>It is very time consuming and please suggest me the best way, I already did test Chrome Developer Tools and CodePen. Still not figuring out why foundation website doesn't provide instruction clearly. </p>