O'Reilly logo

Complete Bootstrap: Responsive Web Development with Bootstrap 4 by Ian Whitley, David Cochran, Bass Jobsen, Matt Lambert

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Setting up the markup

We will start by creating the footer markup. We want this footer to be as functional and useful for the user as possible. We'll build the markup as follows:

  1. Start with the footer of the Portfolio project from Lesson 8, Bootstrapping Your Portfolio. You'll find the HTML Markup code of the footer in the html/includes/footer.html file.
  2. Move HTML code for the logo and add it directly under the social links and create a new include for the additional footer content as follows:
            <footer role="contentinfo">         {{> footercolumns}}         <div class="container social-logo">         <ul class="social">         <li class="social-item"><a href="#" class="social-link"          ><i class="fa fa-twitter"></i></a></li>          ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required