HOVER background color for button that says "continue" not changing as it should

[Diversified Woman]

Hope someone can help me correct this since no matter what I try it doesn't seem to address the issue.  Ugh!

As part of the Glitter theme on WP, I am trying to make the hover color when someone mouses over the "continue" button to change to color #B8A12E  (gold). The button when you arelooking at  should have a background color of #668099. It's just the hover / mouseover color I want to display different in that gold .  

No matter what I do it does not give me the hover effect in changing the button background color. Ironically however when you look at the sidebar for the "enews button" it functions as it should, with the hover background color going to gold B8A12E .

I am just trying to make the "continue" button that appears on the home page below each post excerpt,  do the very same thing but it's not.  

HELP! Really scratching my head on this one.

/* Buttons
------------------------------------------------------------ */

.enews #subbutton {
   
    border: none;
    border-radius: 20px 20px 20px 20px;
    font-family: 'Oswald', Georgia,"Times New Roman",Times,serif;
    font-size: 12px;
    font-weight: normal;
    height: 28px;
    margin: -10px 0 0 -2px;
    padding: 0 4px 4px 4px;
    text-decoration: none;
    text-transform: uppercase;
    width: 30px;
}

input[type="button"],
input[type="submit"],
a.more-link {
 background: #758EA3;
 border: 1px dotted #668099;
 color: #fff;
 font-size: 13px;
 font-weight: normal;
 padding: 2px 12px 2px;
 text-decoration: none;
}

.enews #subbutton:hover {
 background: #B8A12E;
 color: #fff;
}

input:hover[type="button"],
input:hover[type="submit"],
a.more-link:hover {
 background: url(images/button.png) 0 -40px;
 cursor: pointer;
 background: #668099;
}

[SoZo]

Please include a link to your site with all questions so that people can see what is going on.

---

John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

[Diversified Woman]

This reply has been marked as private.

[SoZo]

You're using the turquoise color option so the link background is set by

.glitter-gold-turquoise input[type="button"],
.glitter-gold-turquoise input[type="submit"],
.glitter-gold-turquoise a.more-link {
background: #758EA3;
color: #fff;
}

And there is no .glitter-gold-turquoise a.more-link:hover in the style sheet

---

John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

[Diversified Woman]

Can I add that to the  stylesheet to make this work?

Odd because in the demo for this particular theme it did change colors.

So is this how I would modify the code to get the desired effect needed?

.glitter-gold-turquoise input[type="button"],
.glitter-gold-turquoise input[type="submit"],
.glitter-gold-turquoise a.more-link {
background: #758EA3;
color: #fff;
}

.glitter-gold-turquoise a.more-link:hover {
background: #B8A12E;
color: #fff;
}

[Diversified Woman]

Apparently that was the FIX! Thanks for pointing me in the right direction. 🙂

[SoZo]

You're welcome 🙂

---

John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

[Author]

Posts