"footer 2"
Bootstrap 3.3.0 Snippet by webenlance

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.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 ----------> <link href="https://fortawesome.github.io/Font-Awesome/assets/font-awesome/css/font-awesome.css" rel="stylesheet"> <!--footer start from here--> <footer> <div class="container"> <div class="row"> <div class="col-md-4 col-sm-6 footerleft "> <div class="logofooter"> Logo</div> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley.</p> <p><i class="fa fa-map-pin"></i> 210, Aggarwal Tower, Rohini sec 9, New Delhi -        110085, INDIA</p> <p><i class="fa fa-phone"></i> Phone (India) : +91 9999 878 398</p> <p><i class="fa fa-envelope"></i> E-mail : info@webenlance.com</p> </div> <div class="col-md-2 col-sm-6 paddingtop-bottom"> <h6 class="heading7">GENERAL LINKS</h6> <ul class="footer-ul"> <li><a href="#"> Career</a></li> <li><a href="#"> Privacy Policy</a></li> <li><a href="#"> Terms & Conditions</a></li> <li><a href="#"> Client Gateway</a></li> <li><a href="#"> Ranking</a></li> <li><a href="#"> Case Studies</a></li> <li><a href="#"> Frequently Ask Questions</a></li> </ul> </div> <div class="col-md-3 col-sm-6 paddingtop-bottom"> <h6 class="heading7">LATEST POST</h6> <div class="post"> <p>facebook crack the movie advertisment code:what it means for you <span>August 3,2015</span></p> <p>facebook crack the movie advertisment code:what it means for you <span>August 3,2015</span></p> <p>facebook crack the movie advertisment code:what it means for you <span>August 3,2015</span></p> </div> </div> <div class="col-md-3 col-sm-6 paddingtop-bottom"> <div class="fb-page" data-href="https://www.facebook.com/facebook" data-tabs="timeline" data-height="300" data-small-header="false" style="margin-bottom:15px;" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"> <div class="fb-xfbml-parse-ignore"> <blockquote cite="https://www.facebook.com/facebook"><a href="https://www.facebook.com/facebook">Facebook</a></blockquote> </div> </div> </div> </div> </div> </footer> <!--footer start from here--> <div class="copyright"> <div class="container"> <div class="col-md-6"> <p>© 2016 - All Rights with Webenlance</p> </div> <div class="col-md-6"> <ul class="bottom_ul"> <li><a href="#">webenlance.com</a></li> <li><a href="#">About us</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Faq's</a></li> <li><a href="#">Contact us</a></li> <li><a href="#">Site Map</a></li> </ul> </div> </div> </div>
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,300); footer { background-color:#0c1a1e; min-height:350px; font-family: 'Open Sans', sans-serif; } .footerleft { margin-top:50px; padding:0 36px; } .logofooter { margin-bottom:10px; font-size:25px; color:#fff; font-weight:700;} .footerleft p { color:#fff; font-size:12px !important; font-family: 'Open Sans', sans-serif; margin-bottom:15px;} .footerleft p i { width:20px; color:#999;} .paddingtop-bottom { margin-top:50px;} .footer-ul { list-style-type:none; padding-left:0px; margin-left:2px;} .footer-ul li { line-height:29px; font-size:12px;} .footer-ul li a { color:#a0a3a4; transition: color 0.2s linear 0s, background 0.2s linear 0s; } .footer-ul i { margin-right:10px;} .footer-ul li a:hover {transition: color 0.2s linear 0s, background 0.2s linear 0s; color:#ff670f; } .social:hover { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); } .icon-ul { list-style-type:none !important; margin:0px; padding:0px;} .icon-ul li { line-height:75px; width:100%; float:left;} .icon { float:left; margin-right:5px;} .copyright { min-height:40px; background-color:#000000;} .copyright p { text-align:left; color:#FFF; padding:10px 0; margin-bottom:0px;} .heading7 { font-size:21px; font-weight:700; color:#d9d6d6; margin-bottom:22px;} .post p { font-size:12px; color:#FFF; line-height:20px;} .post p span { display:block; color:#8f8f8f;} .bottom_ul { list-style-type:none; float:right; margin-bottom:0px;} .bottom_ul li { float:left; line-height:40px;} .bottom_ul li:after { content:"/"; color:#FFF; margin-right:8px; margin-left:8px;} .bottom_ul li a { color:#FFF; font-size:12px;}

Related: See More


Questions / Comments:

the background color doesnt cover the full width when i used it. Is there any alternative please ?

Boom_ Jack () - 1 year ago - Reply 1


Plagiarism detected! Source: http://bootsnipp.com/snippe...

Nep () - 1 year ago - Reply 1


Doesn't work well with bootstrap 4.0.0.-alpha.6 .. what a pity :) Nice job anyway

Agb75 () - 1 year ago - Reply 1


bootstrap 4 vs 3 has many changes in files . bootstrap 3 wont work with 4 :)

I tried to convert many things but failed.

Mansoor Ahmad () - 1 year ago - Reply 1


when i added this to my my webpage the alignment was not proper. how to correct this?

nj () - 1 year ago - Reply 1


thank you very much sir i hope this is free.

Ismail Ibrahim () - 1 year ago - Reply 1


everything is free here !!

Mansoor Ahmad () - 1 year ago - Reply 1