JSFiddle - React, Tailwind, and code Playground

by Wisdom Abioye

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="navbar navbar-static">

        <div class="navbar-inner">

            <a href="#" class="brand">Brand</a>

            <ul role="navigation" class="nav">

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

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

                <li class="dropdown">

                    <a href="#" data-toggle="dropdown" class="dropdown-toggle">Messages <b class="caret"></b></a>

                    <ul class="dropdown-menu">

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

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

                        <li><a href="#">Sent Items</a></li>

                        <li class="divider"></li>

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

                    </ul>

                </li>

            </ul>

            <ul class="nav pull-right">

                <li class="dropdown">

                    <a href="#" data-toggle="dropdown" class="dropdown-toggle">Admin <b class="caret"></b></a>

                    <ul class="dropdown-menu">

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

                        <li><a href="#">Another action</a></li>

                        <li class="divider"></li>

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

                    </ul>

                </li>

            </ul>

        </div>

    </div>