WordPress Navigation Help

Hey everyone,

I was hoping someone could help me figure out an issue I was having with the site navigation on a WordPress site I’m working on. The link to the site is http://appliedliningsolutions.com/ . I’m trying to fix the current page item issue I am having. The page that indicates what page you are on is supposed to have a blue background which it does, but when I go to make it line up with the rest of the navigation it messes with the other elements on the page. I used the code -

#access ul li.current_page_item {
background-color: #4381a3;
height: 46px;
margin-top: 7px;
}

Using the margin-top and height makes it line up but the other elements on the navigation are then messed up. Should I use different code or is there something I haven’t added or that needs to be taken out? Hope this all makes sense and thank you to everyone that tries to help out.

Hi A-Town. Welcome to the forums. :slight_smile:

Firstly, remove the top margin on the current LI and remove the background color from the LIs. Instead, set the <a>s to display: block, and put the background color on them. E.g.

#access .menu .current_page_item a {
  [COLOR="#FF0000"]display: block;[/COLOR]
  background: [COLOR="#FF0000"]#4381A3[/COLOR] url("/wp-content/themes/als-child/siteelements/nav_line.png") no-repeat right bottom;
}