Please subscribe to watch this video Register

Dreamweaver - Building Responsive Bootstrap websites

Production video - Adding more Bootstrap columns & rows

Daniel Walter Scott || VIDEO: 16 of 54

Contents

Comments

Overview

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.