JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.2/css/font-awesome.min.css">
	<nav class="navbar navbar-default">
		<div class="container-fluid">

			<div class="navbar-header">
				<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</button>
				
				<ul class="nav navbar-nav nav-pills navbar-right">
					<li><a class="navbar-brand"><i class="fa fa-power-off"></i></a></li>
					<li class="label-cont">
					<a href="/link">
						<span class=""><i class="fa fa-commenting"></i></span>
					</a>
				</li>
				</ul>
		    </div>

		</div>
	</nav>

CSS

.label-cont{
  position: absolute!important; /*Importan used only to example. Could ve overrated with hierarchy*/
  right: 60px;
}