JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>MyApp</title>

	<!-- External CSS to include. -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="auditcloud.css" />

	<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
		<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
		<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->
</head>
<body>
	<div class="wrapper">
        <div class="container-fluid">
			<!-- Header and main nav. -->
			<nav class="navbar navbar-inverse">
				<div class="navbar-header">
					<a class="navbar-brand" href="#">My<b>App</b></a>
				</div>
				<div>
					<ul class="nav navbar-nav">
						<li><a href="#">Learn</a></li>
						<li><a href="#">Contact</a></li>
						<li class="signin">
							<a id="popoverData" href="#" data-content="Replace this with a login form" rel="popover" data-placement="bottom" data-original-title="Sign in to your account" data-trigger="hover">Sign In | Register</a>
						</li>
					</ul>
				</div>
			</nav>
		</div>
	</div>
	
	<!-- Footer. -->
	<div class="container-fluid">
		<footer class="footer">
			<div class="row">
				<div class="col-md-5 col-md-offset-1">
					Footer 1
				</div>
				<div class="col-md-6">
					Footer 2
				</div>
			</div>
		</footer>
	</div>

	<!-- Scripts to include. -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
	<script...

CSS

* {
	margin: 0;
}

html, body {
	height: 100%;
}

.navbar-fixed-top {
    min-height: 200px;
}

.navbar-inverse .navbar-nav > li > a {
	color: rgb(255,0,0);
}

.nav .signin {
    position:absolute;
    top:0;
    right:0;
}

.wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -4em;
}

.footer, .push {
	height: 4em;
}

.footer {
	background: rgb(0, 100, 255);
}

JavaScript

$('#popoverData').popover();