CodePen

HTML

            
              <nav>
  <ul>
    <li><a href="#">link one</a></li>
    <li><a href="#">link two</a></li>
    <li><a href="#">link three</a></li>
    <li><a href="#">link four</a></li>
  </ul>
</nav>
            
          
!

CSS

            
              nav{
  width: 60%;
  min-width: 400px;
  max-width: 960px;
  margin: 0 auto;
  background: #EEEEEE;
  
  ul{
    list-style: none;
    display: table;
    margin: 0 auto;
    padding: 0;
    background: #DDDDDD;
    padding: 15px;
    
    li{
      float: left;
      
      a{
        padding: 5px;
        margin: 0 5px;
        background: #CCCCCC;
        display: block;
      }
    }
  }
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................