"Footer Example"
Bootstrap 4.1.1 Snippet by vbctv

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" rel="stylesheet"> <div class="spf-footer py-3"> <div class="container"> <div class="row"> <div class="col-md-2 d-flex"> <img class="spf-img align-self-center" src="#" width="100px"></div> <div class="col-md-5"> <div class="spf-apps d-flex"> <p class="spf-title align-self-center">WATCH ANYTIME</p> <a class="btn" href="https://facebook.com/sparkktv" target="_blank" role="button"><i class="fab fa-apple fa-2x"></i></a> <a class="btn" href="https://facebook.com/sparkktv" target="_blank" role="button"><i class="fab fa-google-play fa-2x"></i></a> <a class="btn" href="https://facebook.com/sparkktv" target="_blank" role="button"><i class="fab fa-amazon fa-2x"></i></a> <a class="btn" href="https://facebook.com/sparkktv" target="_blank" role="button"><i class="fab fa-windows fa-2x"></i></a> </div></div> <div class="col-md-5"> <div class="spf-social d-flex float-right"> <p class="spf-title align-self-center">CONNECT WITH US</p> <a class="btn" href="https://facebook.com/sparkktv" target="_blank" role="button"><i class="fab fa-facebook fa-2x"></i></a> <a class="btn" href="https://www.twitter.com/sparkktv" target="_blank" role="button"><i class="fab fa-twitter fa-2x"></i></a> <a class="btn" href="https://instagram.com/sparkktv" target="_blank" role="button"><i class="fab fa-instagram fa-2x"></i></a> <a class="btn" href="https://youtube.com/WatchSparkkTV" target="_blank" role="button"><i class="fab fa-youtube fa-2x"></i></a> <a class="btn" href="https://www.pinterest.com/sparkktv" target="_blank" role="button"><i class="fab fa-pinterest fa-2x"></i></a> </div></div></div></div> <section class="spf-links my-3"> <ul class="nav justify-content-center"> <li class="nav-item"><a href="index.php?Itemid=233" class="nav-link px-2">Terms Of Use</a></li> <li class="nav-item"><a href="index.php?Itemid=1807" class="nav-link px-2">Privacy Policy</a></li> <li class="nav-item"><a href="index.php?Itemid=9286" class="nav-link px-2">Ads & Cookies</a></li> <li class="nav-item"><a href="index.php?Itemid=9453" class="nav-link px-2">Devices</a></li> <li class="nav-item"><a href="https://help.sparkk.tv" class="nav-link px-2">Help Center</a></li> <li class="nav-item"><a href="https://newsroom.sparkk.tv" class="nav-link px-2">Newsroom</a></li> <li class="nav-item"><a href="index.php?Itemid=9325" class="nav-link px-2">Sitemap</a></li> <li class="nav-item"><a href="index.php?Itemid=8368" class="nav-link px-2">Contact Us</a></li> </ul></section> <section class="spf-copyright"> <p class="text-center text-primary">Copyright © 2022 Company, Inc</p> </section></div>
body{max-width:2560;margin-left:auto;margin-right:auto;background-color:#212125;} a{color:#fff;}a:hover{color:#187fdd;} .spf-footer{background:radial-gradient(circle, rgba(17,44,69,1) 50%, rgba(33,33,37,1) 100%);padding-left:95px;padding-right:95px;} .spf-links .nav-item{font-size:14px;font-weight:600;} .spf-copyright p{color:#187fdd;font-size:15px;font-weight:800;} .spf-subfooter{background-color:#2d2d32;} .spf-title{color:#fff;font-size:14px;font-weight:600;margin-bottom:0;}

Related: See More


Questions / Comments: