Need a right border on these elements

Melody Scott
Melody Scott used Ask the Experts™
on
http://dev2.magickitchen.com/index.html  I need a white border (or a pipe) on the <li> tag to separate the elements on the top navigation bar.

For some reason, I'm having trouble with that. help?

Thanks.
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Top Expert 2015
Commented:
Problem is, a border only looks good when the menu is on a single row. Below 1200px wide it goes to two rows. Then more rows appear as you get even narrower. It seems that additional padding or margins are also being added around the menu items at narrower widths. Then the border really looks bad.

You could add something like this media query for screens wider than 1200px. This just adds to the definition on line 101 of style.css.

@media screen and (min-width: 1200px) {
  header nav ul li a {
    border-right: 1px solid #ffce65;
  }
}

Author

Commented:
That works nicely, thanks very much!!
Top Expert 2015

Commented:
That was easy. You're welcome. Thanks for the points.

Author

Commented:
Easy for you. ;)

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial