Reusing a button class in the navigation

Hey buddy, nice simple one. We've made this lovely Button Style that we want to reuse for our navigation, to change it from this to this. So we're going to reuse it and we're going to add a little bit of extra just to space it out. It's pretty simple, let's jump in and do it. 

So we want to repeat our fancy work we did down here, along these little buttons down here, plus do a little bit of extra to kind of separate them out. So to reuse our Style we're going to open up VS code. We are going to just, up the top here, we just put in this basic stuff to get started. Remember, we're going to type in-- we need three links. So we need A-tags, we need--

Now I could start typing them all out. I'm going to show you a cool little thing. So I want A-tags with my button applied to them. So as long as they're joined together, that will say, "I'm going to have an A-tag with my button adjoined", and also want three of them. Cool, three of them, please. Hit 'Return'. Cool, huh. I'm going to have my multiple cursor. Now on my PC it is, I don't have a PC, I have a Mac. On my Mac it's 'Command Option'. And I just use my down arrow, and it made multiple cursors. Yours will be 'Ctrl Alt' on a PC. I'm just going to add hash, '#' to all these guys. 

Now any text, can't remember what it was, what was it? We had-- zoom out. It was Book Online, About, and Contact. So I can do that, 'Book Online'. 'About'. 'About'. I'd be a really fast typist if I could spell. 'Contact'. Ah, I closed it down. I don't impress you will all my shortcuts. It did not work, that was a big failure. It's like, I'm typing pretty fast. Let's check it in the browser. Now because I've gone and had lunch between this video and the last one, I'm just going to turn it off and turn it back on, just to make sure I don't run into the same problem again, and not updating. Cool, huh. 

So we just reused the same class over here, but I want to do something slightly different. I want there to be a bit more gap between them. So what I'm going to do, over here, is I'm going to say, actually, I'd like, if that A, my button appears, if it's inside of a Nav, so remember, space means this, inside of this, I want you to do something, and maybe a bit of margin. Margin to the left, I want left, yeah. Left, how many pixels? 30 pixels. Let's have a little look, cool. 

So don't want it both sides, obviously that's the right, that's the left, so it's a bit there, bit there, and it's actually stuff hanging over here. There's a margin out that side, but it's not making any difference to my design, so I'm happy. That's how to reuse it. What we're going to do in the next one is we're going to customize it a bit. Well, we're going to customize it hugely, coming up, we're going to do drop down menus and all sorts of cool stuff, but yeah, that's how to reuse a class that you've made, plus add a little bit of extra. All right, next video.