CodePen

HTML

            
              <nav>
  <ul>
  <li><a href="">Link One</a></li>
  <li class="current"><a href="">Link Two</a></li>
  <li><a href="">Link Three</a></li>
  <li><a href="">Link Four</a></li>
  </ul>
</nav>
            
          
!
via HTML Inspector

CSS

            
              nav {
  width:960px;
  margin: 25px auto;
}

nav ul li {
  height:80px;
  float:left;
  width:25%;
  text-align:center;
  background:grey;
  line-height:50px;
}

nav ul li a {
  text-decoration:none;
  display:block;
  width:80%;
  height:40px;
  margin:10px 10%;
}

nav ul li.current a {
  border-bottom: 3px groove darkgrey;
}
  
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

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