"Footer for eCommerce site"
Bootstrap 3.2.0 Snippet by jsabu300

<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.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 ----------> <footer> <div style="min-height: 250px;" class="footer" id="footer-sub"> <div class="container"> <div class="row"> <div class="col-md-4"> <h5> HELP </h5> <ul> <li><a href="">Payments</a><hr></li> <li><a href="">Saved Cards</a><hr></li> <li><a href="">Shipping</a><hr ></li> <li><a href="">Cancellation & Returns</a><hr></li> <li><a href="">FAQ</a></li> </ul> </div> <div class="col-md-4"> <h5> COMPANY NAME </h5> <ul> <li><a href="">Contact Us</a><hr></li> <li><a href="">About Us</a><hr></li> <li><a href="">Careers</a><hr></li> <li><a href="">Press</a><hr></li> <li><a href="">Sell on our website</a></li> </ul> </div> <div class="col-md-4"> <h5> MISC </h5> <ul> <li><a href="">Online Shopping</a><hr></li> <li><a href="">Affliate Program</a><hr></li> <li><a href="">Gift Card</a><hr></li> <li><a href="">Subscription</a><hr></li> <li><a href="">Sitemap</a></li> </ul> </div> </div> <hr style="margin-bottom:0px; margin-top:30px; padding:0px;"> <div class="row" id="sub-two"> <div class="col-md-4"> <div class="vertical-line text-center"> <span class="glyphicon glyphicon-map-marker"></span> <h4>TRACK YOUR ORDER</h4> </div> </div> <div class="col-md-4"> <div class="vertical-line text-center"> <span class="glyphicon glyphicon-refresh"></span> <h4>FREE & EASY RETURNS</h4> </div> </div> <div class="col-md-4"> <div style="margin:8px;" class="text-center"> <span class="glyphicon glyphicon-remove-circle"></span> <h4 style="color:#6d6c6c;">ONLINE CANCELLATIONS</h4> </div> </div> </div> <hr style="margin-bottom:30px; margin-top:0px; padding:0px;"> </div> </div> <div style="min-height: 50px;" id="footer-main"> <ul> <li><a href=""><b>About Us</b></a></li> <li><a href=""><b>Partner with us</b></a></li> <li><a href=""><b>Terms & Conditions</b></a></li> <li><a href=""><b>Blog</b></a></li> <li><a href=""><b>Customer Service</b></a></li> </ul> <div id="social-menu"> <ul> <li><a href=""><img style="max-width:18px; margin-top: -7px;" src=""></a></li> <li><a href=""><img style="max-width:18px; margin-top: -7px;" src=""></a></li> <li><a href=""><img style="max-width:18px; margin-top: -7px;" src=""></a></li> </ul> </div> </div> </footer>
#footer-sub{ background-color: #f3f7f8; border-top: 1px solid #dbdbdb; } #footer-main{ background-color: #012b72; } #footer-sub h5{ color:#565656; margin-top: 25px; } #footer-sub ul{ list-style: none; margin-top: 20px; } #footer-sub hr{ margin: 5px; } #footer-sub ul li{ margin-left: -38px; } #footer-sub a:link { text-decoration: none; color:#565656; font-size: 12px; } #footer-sub a:visited { text-decoration: none; color:#565656; } #footer-sub a:hover { text-decoration: none; color: blue; } #footer-sub a:active { text-decoration: none; color:#565656; } .vertical-line{ border-right: 1px solid #dbdbdb; margin: 8px; padding: 0px; } .glyphicon { font-size: 35px; color:#6d6c6c; } #sub-two{ margin: 0px; padding: 0px; } #sub-two .vertical-line h4{ color:#6d6c6c; } #footer-main ul{ list-style: none; } #footer-main ul li{ float:left; text-decoration: none; padding-left: 15px; margin-top: 17px; } #footer-main a:link { color:white; font-size: 12px; } #footer-main a:visited { color:white; } #footer-main a:hover { text-decoration: none; color: #00b9f5; } #footer-main a:active { color:white; } .glyphicon-search{ font-size: 20px; } #social-menu{ float: right; margin-right: 60px; } #side-padding{ padding: 0px; margin: 0px; }

Related: See More


Questions / Comments: