<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <header style="background-color:silver;margin-bottom: 0px;" class="navbar navbar-static-top" id="top" role="banner"> <div class="container"> Top Menu </div> </header> <div id="content"> <div style="background-color:whitesmoke;height:150px" class="container"> Header </div> </div> <div class="container"> <div class="row"> <div style="background-color:rgb(221, 221, 221);height:600px" class="col-md-9" role="main"> Main Content </div> <div style="background-color:rgb(190, 190, 192);height:600px" class="col-md-3"> Side Bar </div> </div> <div class="row"> <div style="background-color:#c7c7c7;" class="hidden-xs hidden-sm" role="complementary"> (hide on resize) </div> </div> </div> <footer style="height: 200px; background-color:gray;" role="contentinfo"> <div class="container"> Footer </div> </footer>