nsitedesigns
asked on
Change navigation font color on mobile sizes
What do I need to modify so that the navigation on mobile devices has white text where the blue mouse over color is? Below is the only responsive css code I could find on the css file.
Screen Shot
http://screencast.com/t/9OSrr0H2xA2
Beta Site
http://298.6e8.myftpupload.com/
/* Responsive Menu
--------------------------------------------- */
.responsive-menu-icon {
cursor: pointer;
display: none;
}
.responsive-menu-icon::before {
content: "\f333";
display: block;
font: normal 20px/1 'dashicons';
margin: 0 auto;
padding: 10px;
text-align: center;
}
Screen Shot
http://screencast.com/t/9OSrr0H2xA2
Beta Site
http://298.6e8.myftpupload.com/
ASKER
Yes, sorry, I meant I would use simple custom css plugin. Your suggestion worked for the main navigation buttons on mobile device but the submenus don't display any change at all. is there a way to add the blue background with white text to submenus too? If you want me to create a new question, I will. Thanks
Those items currently have a transparent background color. The selector for the style that targets them is
.genesis-nav-menu.responsive-menu .sub-menu li a, .genesis-nav-menu.responsive-menu .sub-menu li a:hover
ASKER
Thanks. I tried adding a background color to the above selector but it didn't appear to take.
Any idea what I did wrong?
.genesis-nav-menu.responsive-menu .sub-menu li a, .genesis-nav-menu.responsive-menu .sub-menu li a:hover {
background-color:#0088ce;
color:#fff;}
Any idea what I did wrong?
Perhaps I misunderstood. Are the submenus displayed when you click the down arrow at the end of the main menu item? Those items have changed color and background-color.
ASKER
I was having a caching issue. So now, yes, ALL the submenus appear as light blue. Not really what I was looking for so I will have to see if I can tweak. Give me a moment.
ASKER
Cool - OK got it to work almost perfectly. Trying now to remove the dark blue hover on current page on sub menus. Can't seem to find the code to remove that. It is hard to use Inspect Element to view code because drop down menus go away.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Open in new window