From the course: CSS Positioning Best Practices

Unlock this course with a free trial

Join today to access over 22,400 courses taught by industry experts.

Laying out a main menu

Laying out a main menu

In this lesson, we are going to go ahead and set up this menu here. This is our main menu for the whole site. You see it has these lovely little rollovers and it's positioned over here on the header. So we'll go ahead and get started. In our text editor, we have where we left off in the last lesson and we have there beginning.html and beginning.css out of the 04-menu folder in our Exercise Files. So we'll start by doing our Save As. I'm just going to save this as header. html, and our CSS, we'll save as main.css. All right, the first thing we are going to do here is we are going to insert the HTML for our header. So there is the div for positioning our mainMenu and inside here we have an unordered list. Again, this is so that it looks nice for browsers that don't support the graphical or the CSS. There's four line items. So I'm going to go ahead and paste that into four places. So I use copy and paste a lot. This saves a lot of typing. Put in this home.html here and this one is going…

Contents