How to create a sticky footer with bootstrap

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

Code:

<html>
<head>
<meta charset=”utf-8″ />
<meta name=”author” content=”XYZ” />
<title>Twitter Sticky Footer</title>
<link rel=”stylesheet” href=”css/bootstrap.min.css” />
<style>
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;
}
</style>
</head>
<body>
<div class=”wrapper”>
<div class=”container”>

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

For reference Clickhere

Advertisements

Leave a Reply

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

WordPress.com Logo

You are commenting using your WordPress.com 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 )

Google+ photo

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

Connecting to %s