[Natekj]

Im trying to change the color of the Current sub menu. I have changed the color of submenus that are not the current selected one.

I also have changed the the color of the currently selected page menu.
But I cant get the currently selected submenu to be the color I want. Its always staying the same color as the currently selected page menu.

Please help, Ive been here hours…

[Sakin]

@Natekj: Sorry I don’t understand what you mean. Can you post in your site URL and explain in reference to your site. So, that I can understand what you have done and what you want to do it next.

[Natekj]

http://www.phoneandtabletreviews.com/

Click on one of the pages on menu. Some have submenus.

But the selected submenu background color is the same as the menu bar page background (once its been selected)

[Sakin]

@Natekj: Do you mean to change the Sub Menu current menu item, then you can use the following CSS in “Appearance => Theme Options => Custom CSS” box.
#header #mainmenu ul.sub-menu li.current-menu-item { background-color: #fff; }

[Natekj]

Thanks for the reply.
I tried that code but it does not change the submenu current background color

if you click on 1,2 or 3 the entire submenu is still orange. I need it black but the page 1,2 or 3 that you selected first of all needs to be orange still.

[Natekj]

Thanks for the reply.
I tried that code but it does not change the submenu current background color
if you click on 1,2 or 3 the entire submenu is still orange. I need it black but the page 1,2 or 3 that you selected first of all needs to be orange still.

[Natekj]

I still cant get this done after hours of trying and using chrome dev tools. Im missing something simple. Appreciate any help

[Sakin]

@Natekj: I see that you are changing in core style.css which is not recommended at all. Either you need to change CSS from “Custom CSS” box in Theme Options panel or you need to change it by build child theme. As all the changes that you made on core theme files will be reverted back to original when you update the theme.

So, first revert back the original style.css

Then following CSS in supposed to be add in “Appearance => Theme Options => Custom CSS” box, which will change the sub menu current item background color to white.
#header #mainmenu ul.sub-menu li.current-menu-item a { background-color: #fff; }

[Natekj]

Im actually using a child theme. I have a child folder and child css with the template linking back to simple-catch folder :s

I done what you said putting into the custom css and deleting everything in my child theme style to double check if it works. It didnt so im left stumped and been at this little problem for hours :/ whats going wrong. My child theme style css is empty of any code. So all the code loaded should be from the original simple-catch… But it still doesnt work

http://postimg.org/image/e026qrqkz/

[img]http://postimg.org/image/e026qrqkz/[/img]

As you can see in the picture, the currently selected menu page is giving the currently selected submenu the same color. I would like them different colors

[Natekj]

Also, I havent done any editing of the original style css in the original parent simple-catch folder.

What I just done to double check is activate the simple-catch theme (not my child) and put that code you wrote in the custom css box and saved. It still doesnt work and gives the same outcome as the picture above.

[Natekj]

Ive tried so many ways of doing this. Ive looked through so many forum topics on many forums and come to the conclusion that in style.css this theme does not allow different color for a sub menu, once the a top menu has been selected.

[Sakin]

@Natekj: If you check in your site now and go to the page 7 under 2, that is http://www.phoneandtabletreviews.com/category/amazon-kindle-reviews/amazon-kindle-fire-hdx-8-9-review/. You will see the background color of current menu item 7 as white background. This shows the code is working.

[Natekj]

Ah right, I think I havent explained it right. Im new :/ I mean the background of the submenu after selection of a top menu item.

Example click on 1 and background turns grey, which then shows 4 and 5 as submenu with the background thats grey. Its the background of 4 and 5 (without clicking on them) that i want as a different color rather than grey.

[Sakin]

@Natekj: Yes all confusing. So, can you add in the following CSS in “Appearance => Theme Options => Custom CSS” box.

/* Sub-menu of Current Menu */
#header #mainmenu .current-menu-item .sub-menu a { background-color: #fff;  color: #000; } 
/* Sub-menu of Current Menu at Hover state */
#header #mainmenu .current-menu-item .sub-menu a:hover { background-color: #000;  color: #fff; }

[Author]

Posts