JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">WebSiteName</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Page 1</a></li>
<li><a href="#">Page 2</a></li>
<li><a href="#">Page 3</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
<li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
</ul>
</div>
</div>
</nav>
<div class="container" style="padding-top: 70px;">
<h1>Olá Mundo!</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi vitae justo hendrerit, vehicula dui eu, semper dui. Donec ornare augue nec pharetra volutpat. Nulla pellentesque ullamcorper sapien vel venenatis. Cras ut ultrices enim. Nunc vitae enim egestas, rhoncus urna vitae, vehicula mauris. Ut vestibulum faucibus volutpat. Aliquam et augue vel mi posuere condimentum sit amet vel diam.</p>
</div>
<div id="barraMin" style="height: 0px; overflow-x: auto;" ></div>
<footer id="footer">
<div id="footer-left">
<div id="link" style="text-align: center; ">RODAPÉ
</div>
</div>
</footer>
</body>
CSS
html, body
{
height: 100%;
}
#footer {
margin: 0px auto 0px auto;
padding: 0px 0 0 0;
text-align: center;
position: static;
width: 100%;
}
.fixed { position: fixed; }
.static { position: static; }
#footer-left {
color: #FFFFFF;
font-size: 11px;
line-height: 11px;
padding: 10px 0 10px 0px;
border-top: 5px solid #A5151E;
border-bottom: 1px solid #dbdbdb;
background: #2A2A2A;
height: 12px;
}
#footer-left a {
color: #FFFFFF;
text-decoration: none;
}
#footer-left a.selected,
#footer-left a:hover {
color: red;
text-decoration: none;
}
#conteudo{ height: 600px; width: 100%; background: yellow; }