JSFiddle - React, Tailwind, and code Playground

by SchmalzyB

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<ul class="nav nav-pills nav-stacked">
  <li class="active"><a href="#">Home</a></li>
  <li><a href="#">Profile</a></li>
  <li><a href="#">Messages</a></li>
</ul>

CSS

@media (max-width: 992px) {
    .nav-stacked > li {
      float: left;
    }
    .nav-stacked > li + li {
      margin-left: 2px;
      margin-top: 0;
    }
}