From the course: Bootstrap 4 Layouts: Responsive Single-Page Design

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Creating an icon layout

Creating an icon layout - Bootstrap Tutorial

From the course: Bootstrap 4 Layouts: Responsive Single-Page Design

Start my 1-month free trial

Creating an icon layout

- [Instructor] After the last lab, we're going to go back to something a little bit simpler, just a regular three-column layout, but I want to show you how you can create your own custom icons. So far, we have been using icons from the Font Awesome library. Occasionally, you want to use your own. And, to do that, what you want is generally something like an .svg file that can be resized nicely, like this one. Then, you want to create your own icon class. I've already got this article right here with an I.D. of page-iconcolumns, it's a little bit tough to mention this. Already have the page-section class, We'll just do a really simple three-column layout here. We'll get started by creating the section tag here, and this section tag is going to have a class of layout-iconcolumns. Because this is going to be a three-column layout, I need to have some sort of container. I'm also going to use the padding "y" class, and put five units, which should be about three ems. Then grab all these…

Contents