Production video - Adding more Bootstrap columns & rows
Overview
Daniel Scott
Founder of Bring Your Own Laptop & Chief Instructor
instructorI discovered the world of design as an art student when I stumbled upon a lab full of green & blue iMac G3’s. My initial curiosity around using the computer to create ‘art’ developed into a full-blown passion, eventually leading me to become a digital designer and founder of Bring Your Own Laptop.
Sharing and teaching are a huge part of who I am. As a certified Adobe instructor, I've had the honor of winning multiple Adobe teaching awards at their annual MAX conference. I see Bring Your Own Laptop as the supportive community I wished for when I was first starting out and intimidated by design. Through teaching, I hope to bring others along for the ride and empower my students to bring their stories, labors of love, and art into the world.
True to my Kiwi roots, I've lived in many places, and currently, I reside in Ireland with my wife and kids.
Hi my name is Dan, in this video we are going to add all the extra rows and columns to the other bands. So I'm going to click inside my services band and I'm going to click grid and row. I'm going to nest it inside here and this one if you look at the template it has, if I turn the guides off, one two three four. You can also see there’s these bits of text underneath but we are going to leave that little bit later on because we are going to look at something called nesting. Well nesting inside nesting but we will do that later on. So at the moment lets just do a nest of four columns and there’s one two three four, perfect. I'm going to come down here, now make sure when you click inside; remember it’s a large three. Three three three which makes 12. Inside this one, lets check out our Photoshop document, it;s going to be the same.
It’s going to have four columns, so we will just make sure, click inside portfolio, insert grid row and column. I'm going to nest it inside of it and it’s going to be four. Click enter, and we are going to do the same thing; we are going to deal with all the text and images inside of it a little bit later on when we deal with images. And the last bit is the footer, so I'm going to click on the footer and I'm going to go row and this one here is, let’s have a look, its actually just one row and one column. And I’m going to nest it inside and it’s just going to be one column and just to double check, click inside and you can see it is a column of 12 and it is one row, awesome. Now lets put the text inside our footer. It’s on our text here, and I select him. Now I click inside and I go insert paragraph and I nest it inside, select the text and then I paste it. Now file, save all and that is all the rows and columns we are going to need for this particular site. All right now lets move on to the next video.