"bootstrap-3 footer"
Bootstrap 3.0.0 Snippet by blairanderson

<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 ----------> <div class="container text-center"> <hr /> <div class="row"> <div class="col-lg-12"> <div class="col-md-3"> <ul class="nav nav-pills nav-stacked"> <li><a href="#">About us</a></li> <li><a href="#">Blog</a></li> </ul> </div> <div class="col-md-3"> <ul class="nav nav-pills nav-stacked"> <li><a href="#">Product for Mac</a></li> <li><a href="#">Product for Windows</a></li> </ul> </div> <div class="col-md-3"> <ul class="nav nav-pills nav-stacked"> <li><a href="#">Web analytics</a></li> <li><a href="#">Presentations</a></li> </ul> </div> <div class="col-md-3"> <ul class="nav nav-pills nav-stacked"> <li><a href="#">Product Help</a></li> <li><a href="#">Developer API</a></li> </ul> </div> </div> </div> <hr> <div class="row"> <div class="col-lg-12"> <ul class="nav nav-pills nav-justified"> <li><a href="/">© 2013 Company Name.</a></li> <li><a href="#">Terms of Service</a></li> <li><a href="#">Privacy</a></li> </ul> </div> </div> </div>

Related: See More


Questions / Comments:

Thanks, nice snippet

Sardafilm () - 9 years ago - Reply 0


Thanks, very helpful!

Melody () - 9 years ago - Reply 0


Nice snippet and thanks :D

Marcelo Cavassani () - 9 years ago - Reply 0


Nice snippet.How can we fix this footer to bottom of the screen.I have used sticky footer but then the contents are getting overlapped with the footer .Suggest me other options.Thanks in advance.

Vasanthi () - 10 years ago - Reply 0


Just add this to your css file:
body{margin-bottom:ABCpx;}
where ABC is the height of your sticky footer.

http://andrewlyndem.com

Andrew Lyndem () - 9 years ago - Reply 0


Very nice snippet. The responsiveness for col-xs, col-sm and col-md should be improved. Right now, the whole page breaks with a lower width than col-lg/col-md.

Alex () - 10 years ago - Reply 0


thank

Krissanawat Kaewsanmuang () - 10 years ago - Reply 0


cool!

teej ten () - 11 years ago - Reply 0