It's possible that the way you're applying a border to the navbar is doubling it because each menu item causes duplication.
Here's what happens... If you apply border: 1px solid black; the menu item shows a single pixel on top and bottom, and the left menu item has a single pixel width on the left side. Between each menu item, there's a border on the left and right. These each meet the next menu item, causing the doubling. Each really has only on one single pixel border, but it appears visually as two pixels.
How to fix it? Simple. Change the border CSS to this:
border-top: 1px solid black;
border-bottom: 1px solid black;
border-left: 1px solid black.
But, on the last menu item, you'll need to go to Dashboard > Appearance > Menus. Click "Screen Options" at the top and check the box for CSS Classes. Edit the last menu item and add a unique class. Let's call it menu-right.
Add this to the custom code:
This makes sure the last menu item is bordered on all four sides.