JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/css/bootstrap-glyphicons.css">
<div class="collapse navbar-collapse" id="myNavbar">

          <ul class="nav navbar-nav">

            <li class="dropdown">
              <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span class="rbgwhitelink">STUFF 1 <span class="caret"></span></span></a>
              <ul class="dropdown-menu">
              </ul>
            </li>

            <li class="dropdown">
              <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span class="rbgwhitelink">STUFF 2 <span class="caret"></span></span></a>
              <ul class="dropdown-menu">
                <li><a href="#">Sub 1</a></li>
                <li><a href="#">Sub 2</a></li>
                <li><a href="#">Sub 3</a></li>
              </ul>
            </li>

            <li class="dropdown">
              <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span class="rbgwhitelink">STUFF 3 <span class="caret"></span></span></a>
              <ul class="dropdown-menu">
              </ul>
            </li>
          </ul>
        </div>
    </div>
  </div>
</nav>

CSS

#rbgnavbar a:hover, a, li, .dropdown-menu li:hover {
    color:#000000;
}

.dropdown-menu li:hover {
    background-color: #000000;
    color: #000000;
}

/* Main dropdown menu items change cover when selected/clicked */
.dropdown-toggle:active, .open .dropdown-toggle, .dropdown:hover {
    background-color: #196143 !important;
}

.dropdown-menu li, .dropdown-menu a {
    text-align: center;
    color: #000000;
}

.dropdown {
    font-size: 10px;
    padding: 0;
    font-weight: bold;
}

#rbgnavbar {
    max-width: 1400px;
    margin-left:auto;
    margin-right:auto;
    background-color:#00502F;
}


.rbgwhitelink {
    color: #000000;
}

.dropdown ul {
    padding-top: 0px;
    padding-bottom: 0px;
    font-size: 10px;
    font-weight: bold;
}

/* Border thickness and color between dropdown menu li, padding */
.dropdown-menu li {
    border-top: 2px double #D3D3D3;
    padding-top: 5px;
    padding-bottom: 5px;
}

/* Background color of li in navbar when hovered over */
.dropdown-menu li > a:hover, .dropdown-menu li > a:focus, .dropdown-submenu:hover > a, .dropdown-menu li:hover {
    background-color: #F2EDE4;
}

/* Makes dropdown-menu li links bold*/
.dropdown-menu li > a, .dropdown-menu li > a:visited {
    font-weight: bold;
}