Subtitles of the Movie

Now one of the final things that I think we'll do here together in regard to our layout is we want to make sure that our layout is center aligned, so how the heck do you pull that off? Well, first of all what I'm going to do is I'm going to make sure that I'm inside Design View here inside Dreamweaver and do you remember this Master ID Selector that we saw earlier, not too long ago? Well, that's the fella that I'm after, so what I'd like you to do is double-click on this guy and you remember that the Master Div contains the entire layout, right, so it sort of wraps around the entire layout that we're working on here. Now what I'm going to do here won't make a whole lot of sense but I'll try and explain it as we go along here. I'm going to head down to the Box Category and then into the Margin area and what I'll do is I'll uncheck Same For All and what I want to do is I want to tell the Rule, the Master Rule, to have a Margin Right of Auto and a Margin Left of Auto, so what that means is I want the Rule to automatically determine how much space should be on the left side and on the right side and if you know about Margin and the Margin Property here in CSS you would know that Margin is the space on the outside of your rule, right? So, I'm telling my style to automatically figure out how much space should be on the right- and the left-hand sides on the outside of that, makes sense. Now there's one other change that I want to make here and he's found down in the Positioning Category. So I'm going to head down to Positioning. You'll see that your Positioning Type right now is set to something called Absolute. Now you may know about Absolute Positioning, you might know about some of the different Positioning options that we have available from the drop-down menu here, or you may not. This could be brand new for you. And you know, if this is brand new for you, here's the short and sweet. What Absolute does is it uses the top-left corner of the web Browser as its Reference point, right? Sort of like what we see in the print world with x and y coordinates. Actually we saw that back in Illustrator not too long ago. Anyway, all I'm going to do here is I'm going to switch my Position value, or my Position setting, to Relative instead of Absolute and then what I'll do is I'll click on OK. Make sure to save everything up, so again head up to File and then down to Save All. Head back to your Browser and hit Refresh. Now, unfortunately, I'm running such a low monitor resolution that I can't tell if my layout actually centered or not, but I know it did because I know what settings to use, but yourself, inside your web Browser, what you should now see is your entire layout sitting right in the middle of your web Browser and that's how to Center Align a CSS-based layout.