Place you nav code inside another div and give that div the 100% and the same background color as the menu.

Try this. I'm giving the html and the CSS menu mnu file so you can make changes as needed.

Here is my solution. The goal is a very simple horz. navigation bar for a site with only 4 or 5 pages. Google and on-line tutorials guided me. CC HTML Editor's Split Screen Preview tool made it easy to fine tune. Colors will need to be matched and actual links need to be added. Initial tests in the vendor's template look good.

Sometimes trying to take shortcuts makes things more difficult.

Thanks again for taking the time to help.

CSS in Header


HTML - List

I see you have found a solution. I also notice the wee space to the left and right of the menu bar, which is due to every browser having its own margin/padding built in. If you want to get rid of that, and have the menu really go wall to wall, insert this at the top of your style sheet:


And if you want to center your menu, change this in the css:
The 490px width comes from the width of the actual menu. So if you add a menu item (or subtract one), you will have to change the width accordingly. I usually add a temporary border: border: 1px solid red; or something, in order to better see what I'm doing.

A further hint would be to change the colour of the active and hover states of the links to something that is visible against the dark blue background.