Bootstrap 3 and Sticky Footer
for the past hour I've been trying to figure out what exactly is wrong
with my sticky footer not working. I have the exact same structure as the
example given on the getboostrap site, but it doesn't seem to work. Any
ideas what is exactly wrong?
All the bootstrap css files are loaded correctly.
<body style="">
<div id="wrap">
<div 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=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">Application name</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="/">Home</a></li>
<li><a href="/Home/About">About</a></li>
<li><a href="/Home/Contact">Contact</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="/Account/Register" id="registerLink">Register</a></li>
<li><a href="/Account/Login" id="loginLink">Log in</a></li>
</ul>
</div>
</div>
</div>
<div class="container">
<div class="jumbotron">
<h1>ASP.NET</h1>
<p class="lead">ASP.NET is a free web framework for building great Web
sites and Web applications using HTML, CSS and JavaScript.</p>
<p><a href="http://asp.net" class="btn btn-primary btn-large">Learn
more »</a></p>
</div>
<div class="row">
<div class="col-md-4">
<h2>Getting started</h2>
<p>
ASP.NET MVC gives you a powerful, patterns-based way to build
dynamic websites that
enables a clean separation of concerns and gives you full
control over markup
for enjoyable, agile development.
</p>
<p><a class="btn btn-default"
href="http://go.microsoft.com/fwlink/?LinkId=301865">Learn more
»</a></p>
</div>
<div class="col-md-4">
<h2>Get more libraries</h2>
<p>NuGet is a free Visual Studio extension that makes it easy to
add, remove, and update libraries and tools in Visual Studio
projects.</p>
<p><a class="btn btn-default"
href="http://go.microsoft.com/fwlink/?LinkId=301866">Learn more
»</a></p>
</div>
<div class="col-md-4">
<h2>Web Hosting</h2>
<p>You can easily find a web hosting company that offers the right
mix of features and price for your applications.</p>
<p><a class="btn btn-default"
href="http://go.microsoft.com/fwlink/?LinkId=301867">Learn more
»</a></p>
</div>
</div>
</div>
</div>
<div id="footer">
<div class="container">
<p class="text-muted credit">Example courtesy <a
href="http://martinbean.co.uk">Martin Bean</a> and <a
href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
</div>
</div>
</body>
No comments:
Post a Comment