JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<div class="navbar navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container"> <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                     <span class="icon-bar"></span>
                     <span class="icon-bar"></span>
                     <span class="icon-bar"></span>
                </a>

            <div class="nav-collapse">
                <ul class="nav">
                    <li class="active"><a href="#">Menu</a>

                    </li>
                    <li><a href="#">On Tap</a>

                    </li>
                    <li><a href="#">Shows</a>

                    </li>
                    <li><a href="#">Surfwear</a>

                    </li>
                    <li><a href="#">Contact</a>

                    </li>
                </ul>
            </div>
            <!--/.nav-collapse -->
        </div>
        <!-- container -->
    </div>
    <!-- navbar-inner -->
</div>
<!-- navbar navbar-fixed-top -->

CSS

.navbar .nav, .navbar .nav > li {
    float:none;
    display:inline-block;
    *display:inline;
    /* ie7 fix */
    *zoom:1;
    /* hasLayout ie7 trigger */
    vertical-align: top;
}
.navbar-inner {
    text-align:center;
}