Title: Menu Color Last modified: August 21, 2016 --- # Menu Color * [dotcomm](https://wordpress.org/support/users/dotcomm/) * (@dotcomm) * [12 years, 11 months ago](https://wordpress.org/support/topic/menu-color-1/) * I’m having trouble changing the font color for the menu from grey to white. Viewing 6 replies - 1 through 6 (of 6 total) * Thread Starter [dotcomm](https://wordpress.org/support/users/dotcomm/) * (@dotcomm) * [12 years, 11 months ago](https://wordpress.org/support/topic/menu-color-1/#post-3848307) * my website is [http://www.twinpalmshealthandbeaauty.com](http://www.twinpalmshealthandbeaauty.com) * [Shapeshifter 3](https://wordpress.org/support/users/shapeshifter-3/) * (@shapeshifter-3) * [12 years, 11 months ago](https://wordpress.org/support/topic/menu-color-1/#post-3848318) * dotcomm, * I don’t have a concrete answer for you, but I can tell you how to find your answer. * Most modern, currently updated browsers have an addon, extension, or built in Developers Tool which is usually activated by right-clicking any item, or image on any webpage. * Once you right-click an item on a page (such as a menu item), a panel will open on the right side of your screen with a categorized list of style.css attributes that indicate what code options are currently being used for your display. * Once you find the CORRECT section (after reading carefully) that is set for your current display; just copy and paste only parts (lines) of that section that you want to change into your Child Theme’s style.css file OR your Theme’s Customizer, and save the changes. * In the past, I have copied an entire section with only one line of code change, and it seemed to screw things up. I would advise ONLY copy the line that you need (in this case “color: xxxxxxxx”) with the opening and closing tag, to get your desired result. * Hope this was not too confusing…Here are links to Dev Tool extensions for Firefox and Google Chrome: * [https://getfirebug.com/community](https://getfirebug.com/community) * [https://chrome.google.com/webstore/category/ext/11-web-development?hl=en-US](https://chrome.google.com/webstore/category/ext/11-web-development?hl=en-US) * If I remember right, the most current version of Google Chrome already contains embedded Dev Tools. Just right-click any section of your website, and left-click“ Inspect Element”. If you make immediate changes in the right panel, your can see what changes will take place. The changes are temporary only, and that’s why you need to copy and paste your chose pieces of code. I also believe this option is already embedded in Internet Explorers 9 and 10. * Here is a short list of more links that might help you out. I have a selfish interest in them…they are on my site: * [http://toolbox-4-websites.com/tools/browsers/useful-addons/](http://toolbox-4-websites.com/tools/browsers/useful-addons/) * Hope this helps. * [Shapeshifter 3](https://wordpress.org/support/users/shapeshifter-3/) * (@shapeshifter-3) * [12 years, 11 months ago](https://wordpress.org/support/topic/menu-color-1/#post-3848324) * dotcomm, * Here’s a one hour video from the Google Chrome Developer’s Team explaining how to use the Dev Tools: * [http://toolbox-4-websites.com/2012/chrome-developer-tools-march-2012-by-paul-irish/](http://toolbox-4-websites.com/2012/chrome-developer-tools-march-2012-by-paul-irish/) * You have to have a decent internet connection to have it displayed properly, AND a little patience….it’s kind of nerdy. * Thread Starter [dotcomm](https://wordpress.org/support/users/dotcomm/) * (@dotcomm) * [12 years, 11 months ago](https://wordpress.org/support/topic/menu-color-1/#post-3848336) * Thank you!! * [Shapeshifter 3](https://wordpress.org/support/users/shapeshifter-3/) * (@shapeshifter-3) * [12 years, 11 months ago](https://wordpress.org/support/topic/menu-color-1/#post-3848397) * dotcomm, * The last post was about “How to Fish”. This one is “A Couple of Fish”(I think). I picked both of these out of Chrome Dev Tools right panel after changing the colors to look at the result BEFORE I copied and pasted them here. I’m not absolutely sure they will work. I’m not a programmer. I just like to Copy and Paste Stuff…… You can too. * Try this for the Menu Color Display: * **.**navbar .nav > li > a { color: #FFFFFF; } * Try this to change the color when you hover over a menu item: * **.**navbar .nav > li > a:hover { color: #e9a825; } * (The HEX color number for the current hover is orange). * [Shapeshifter 3](https://wordpress.org/support/users/shapeshifter-3/) * (@shapeshifter-3) * [12 years, 11 months ago](https://wordpress.org/support/topic/menu-color-1/#post-3848408) * dotcomm, * Here’s a code snippet for your “Seaside Retreat” header: * **.**navbar-wrapper .navbar h2 { color: #FFFFFF; } * I’ve just noticed that as you make these color changes, they only work on a full desktop display. When used on a tablet or smartphone, the old colors come back. That means that additional code snippets need to be copied and pasted into the Theme Customizr. In other words, more choices have to be made from the Dev Tools right panel. * Also, you might want to change the 3 Featured Pages buttons to white also: more code snippets. * Hope this helps……good luck on your efforts. Viewing 6 replies - 1 through 6 (of 6 total) The topic ‘Menu Color’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/customizr/4.4.24/screenshot.png) * Customizr * [Support Threads](https://wordpress.org/support/theme/customizr/) * [Active Topics](https://wordpress.org/support/theme/customizr/active/) * [Unresolved Topics](https://wordpress.org/support/theme/customizr/unresolved/) * [Reviews](https://wordpress.org/support/theme/customizr/reviews/) ## Tags * [browser](https://wordpress.org/support/topic-tag/browser/) * [Themes](https://wordpress.org/support/topic-tag/themes/) * [tools](https://wordpress.org/support/topic-tag/tools/) * 6 replies * 2 participants * Last reply from: [Shapeshifter 3](https://wordpress.org/support/users/shapeshifter-3/) * Last activity: [12 years, 11 months ago](https://wordpress.org/support/topic/menu-color-1/#post-3848408) * Status: not resolved