JSFiddle - React, Tailwind, and code Playground
by CaraGee
HTML
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<script src="/js/respond.min.js"></script>
<script src="//code.jquery.com/jquery.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-hd-collapse"> <span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button> <a href="index.php"><img class="navbar-brand img-responsive" src="http://placehold.it/138x38" alt="Logo"></a>
</div>
<div class="navbar-right">
<ul class="nav" style="float: right; display: inline-block !important">
<li class="dropdown pull-right"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"><img src="http://placehold.it/40x40" alt="Profile Image" style="display: inline-block !important"/><b class="caret grey"></b></a>
<ul class="dropdown-menu">
<li class="dropdown-header">Hello</li>
<li class="divider"></li>
<li><a href="">Thing 1</a>
</li>
<li class="divider"></li>
<li><a href="">Thing 2</a>
</li>
</ul>
</li>
</ul>
<ul class="nav" style="float: right; display: inline-block !important">
<li class="dropdown pull-right"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-globe grey"></span><b class="caret grey"></b></a>
<ul class="dropdown-menu">
<li style="padding: 10px">
<p>News</p>
</li>
...