JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css">
<div class="container">
  <div class="row">
    <div class="col-md-12">
      <ul class="list-inline custom-nav"><!--
        --><li><a href="#">Link</a></li><!--
        --><li><a href="#">Link</a></li><!--
        --><li><a href="#">Link</a></li><!--
      --></ul>
    </div>
  </div>
</div>

CSS

.custom-nav>li {
  padding: 1.5em 1em;
  border-right: 0.1em solid #ccc;
}
.custom-nav>li>a {
  padding: 1.5em 1em;
}
.custom-nav>li:hover {
  background: #777;
}