Hi there, in this tutorial I'm going to show you how to make a 12 column grid basically with one little click. Turn it on, turn it off. XD has got an automatic feature that makes our column layout super easy, super quick. Let's go and do it now. 

First of all, I'm actually Dan from the future. I've come back in time to this video to update it because the original video that I made, you actually had to grab the Rectangle tool and you had to make a column, you had to divide it by 12, and the width, and work out gutters, and all sorts of other drama. So I've come back here to update it because there's a new feature that does it pretty much automatically. 

So when you are going through the rest of this course though-- I haven't gone through and re-shot the entire course because we only use columns a couple of times. So when you do see it, and I'm using big clunky rectangle boxes and locking, and unlocking columns, you can smile knowing that there's a sweet new way to do it. 

So the sweet new way is Black arrow, click in the background, so you got nothing selected. Actually, click on the name of your Artboard, and in here, where it says 'Grid', tick this on, make sure you're on Layout, not Square. We had Square for a while, we're on Layout. And we want how many columns? 12 columns. The gutter width that I use through my tutorial is 15. The column width, it gets to be automatic. Automatically makes the columns fit inside the boundaries of my website. Now, we use a Navigation of 1400 along the top. That's going to be maximum width. So 1400 is kind of what I want to use for my max-width at the side. You might choose something different. Common ones are 1024, 1200. We're going to use 1400 for my navigation. 

We need to work out what the columns are, and all we really need to do is, click on the name, and we need to work out the width to the edges here. So I've got a site that's 1920, got a navigation that's 1400. So I need to do some basic Math. My 1920 minus my navigation leads me this for either side. So either side divided by 2. So that's the gap that I need. So 260 pixels. So I click on the name here, and say I want the width to the edges to be 260 pixels. So, that one now fits perfectly. Leaving a little bit of gutter either side of my navigation. And now you can go ahead and start working on this project. That's a lot easier. You can turn it on and off. You can set it as your default. 

So whenever you make a new one it will go through and use your pre-made settings. You might just choose to use the default, it's up to you but I like a 1400 pixel wide website. All right, that is it. Go forth and build an awesome website. I've already finished this course because I'm the future Dan, and it is a good course. I love XD. All right, bye now.