Community Forums › Forums › Archived Forums › General Discussion › Navigation – CSS Color change
- This topic has 9 replies, 2 voices, and was last updated 10 years, 5 months ago by CathyEarle.
-
AuthorPosts
-
November 5, 2013 at 7:33 pm #71158CathyEarleMember
I can't seem to find where I would change the color for the navigation on this site:
For the button Solutions - When I highlight over the drop-down menu item "Software" the "solutions" button changes to a white background as does the text so it does not show up.
Where do I can the text color for the "Solutions" button when hovering over the sub menu item "Software"?
November 5, 2013 at 7:49 pm #71161nutsandboltsMemberHi Cathy,
Can you provide a link to your site? I'd be glad to take a look. 🙂
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 5, 2013 at 8:04 pm #71165CathyEarleMemberThanks - sorry thought I added - http://peaksmedia.com/sitesafety/
November 5, 2013 at 8:05 pm #71167nutsandboltsMemberOops - there it is! Looking now.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 5, 2013 at 8:08 pm #71170nutsandboltsMemberFind this in your stylesheet:
.genesis-nav-menu .sub-menu a { background-color: #fff; border: 1px solid #f5f5f5; border-top: none; color: #666; font-size: 12px; font-size: 1.2rem; padding: 10px 18px; padding: 1rem 1.8rem; position: relative; width: 148px; }
And change it to this:
.genesis-nav-menu .sub-menu a { background-color: #fff; border: 1px solid #f5f5f5; border-top: none; color: #666 !important; font-size: 12px; font-size: 1.2rem; padding: 10px 18px; padding: 1rem 1.8rem; position: relative; width: 148px; }
Another CSS rule is overriding that one, but adding
!important
to the color like I did above should make the text show up.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 5, 2013 at 8:36 pm #71174CathyEarleMemberChanged that but still not working 🙁
November 6, 2013 at 11:48 am #71278CathyEarleMemberHoping someone is able to help me with this? I've tried the !important but didn't work.
November 6, 2013 at 11:56 am #71279nutsandboltsMemberThe problem is your hover for the main nav menu items - they are set to be black with white text normally, then white with black text on hover. When you move from hovering on that item to hovering on the submenu item, it's reverting back to the white text but not the black background. So somewhere there's a CSS rule for the nav that specifies
color: #fff;
but doesn't specifybackground-color: #222;
.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 6, 2013 at 12:24 pm #71285CathyEarleMemberThanks. I don't want it to go back to the black background colour though - I want it to stay white with a black font. I've tired a ton of different combos with no luck.
Not sure exactly which section in the CSS nav I should be changing to fix it.
November 6, 2013 at 2:12 pm #71304CathyEarleMemberThanks Andrea for the "background-color" guidance. I managed to fix that issue but now have an issue with white borders showing around all each of the menu items. Any tips on where I should look to remove these?
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.