<ul class="nav">
  <li><a href="#">One</a></li>
  <li><a href="#/">Two</a></li>
  <li><a href="#">Three</a></li>
  <li><a href="#">Four</a></li>
</ul>
.nav{
    list-style:none;
    margin:0;
    padding:0;
    text-align:center;
}
.nav li{
    display:inline;
}
.nav a{
    display:inline-block;
    padding:12px 7px 1px 7px;
    text-decoration: none;
    font: 15px/20px montserrat,sans-serif; 
}
.nav a:hover{
    border-bottom: 1px dashed #f00;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.