- This topic has 14 replies, 2 voices, and was last updated 6 years ago by
.
-
Posts
-
I have having this weird issue where the over color over INVESTOR won’t disappear. StudioPress told me that this is the code in question:
.nav-primary li.highlight > a {
background-color: #fff;
border: 1px solid #333;
margin-left: 15px;
padding-left: 15px;
padding-right: 15px;
}
.nav-primary li.highlight > a:hover, .nav-primary li.highlight > a:focus {
background-color: #34313b;
border: 1px solid #34313b;
color: #fff;
}So I adjusted the code to this:
.nav-primary li.highlight > a {
background-color: #fff;
border: 1px solid #fff;
margin-left: 15px;
padding-left: 15px;
padding-right: 15px;
}.nav-primary li.highlight > a:hover,
.nav-primary li.highlight > a:focus {
background-color: #fff;
border: 1px solid #e4e4e4;
color: #fff;I do want the light grey outline to show up on the hover but not the green background in the box. Can someone tell me how to fix this please? The job is due tomorrow. Thanks in advance!
http://dev.qmcresources.com/Hi,
you have to use !important after the :hover, :focus values because the green background color is defined in an inline style.
You mean I have to write code? That’s why I bought the theme. Where is this inline code...that big chunk of code at the beginning? Can you post the block of code please and where exactly this green hex color is so that I can change it? Thank you Christoph.
No, you have to add !important after the code you said you already changed.
.nav-primary li.highlight > a:hover, .nav-primary li.highlight > a:focus { background-color: #fff !important; border: 1px solid #e4e4e4; color: #fff;You will have to change color to something other than white.
Ok but how will this change the green color and why can’t I leave it as white? I don’t want the color in the hover button to show up at all. I just want the letters to change to green and the button light grey outline.
I put important there but the color is still showing up in the box for INVESTOR. Why is it showing up on this link and nowhere else? Very strange.
I'm just going from the code you have posted.
If you change the background-color to white and the color is white, you will see nothing.You either haven't changed the code or you have to empty (plugin / hosting / CDN) caches:
http://prntscr.com/chrcjwThe green background is showing because you added the custom css class "highlight" to that menu element.
I emptied the cache. Still see it. Yes I did add highlight to that menu element. Let me change it brb.
I took off the highlight on all of them. I even deleted the INVESTORS widget and added another one just to make sure but it’s still there. I don’t see it all of the other ones.
I changed the color on the supposed menu to the grey. It did take on INVESTORS but not on the other buttons.
Well,
you didn't use !important after the background-color: http://prntscr.com/chwzcaIf you don't want the highlight class applied, remove it from the menu item at Appearance - Menu.
None of the places where I put !important beside the background worked. I went into the Editor and searched for #024731 on both CSS pages and nothing showed up. The ONLY thing that worked was that I deleted the damn INVESTORS page and created a new one! This worked. I figured since that color was not showing up anywhere, deleting the page was the last resort. 🙂 I took the !important off of the 3 places where I put it because that code did not have an effect.
LOL
Glad you found a solution that worked.
Deleting a page to delete a menu item is sort of a nuclear solution but hey...For future reference, you won't find an inline style in any style.css. The inline styles were most likely created when you made changes in the Customizer.
LOL. Thanks for your help. 🙂 Yes when I get angry, I get surprisingly more focused. Thank you for this piece of information (For future reference, you won't find an inline style in any style.css. The inline styles were most likely created when you made changes in the Customizer.) because I couldn’t figure out WHY I wasn’t seeing the color you showed me esp since I had changed that color to a darker green so I applied a different number.
Sometimes you have to “go nuclear” to get the job done when all else fails. There is more than one road to CSS Nirvana. Ha ha ha!
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.