How to create a sticky footer with bootstrap

Just copy and paste to your html file & test it. good luck 😉


<meta charset=”utf-8″ />
<meta name=”author” content=”XYZ” />
<title>Twitter Sticky Footer</title>
<link rel=”stylesheet” href=”css/bootstrap.min.css” />
html, body {
height: 100%;
footer {
color: #666;
background: #222;
padding: 17px 0 18px 0;
border-top: 1px solid #000;
footer a {
color: #999;
footer a:hover {
color: #efefef;
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -63px;
.push {
height: 63px;
/* not required for sticky footer; just pushes hero down a bit */
.wrapper > .container {
padding-top: 60px;
<div class=”wrapper”>
<div class=”container”>

<div class=”push”><!–//–></div>
<div class=”container”>
<p>Twitter Bootstrap Sticky Footer example</p>

For reference Clickhere


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s