Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I change a button's color on hover?

Tags:

I need to change the color of a button on hover.

Here is my solution, but it doesn't work.

a.button {    display: -moz-inline-stack;    display: inline-block;    width: 391px;    height: 62px;    background: url("img/btncolor.png") no-repeat;    line-height: 62px;    vertical-align: text-middle;    text-align: center;    color: #ebe6eb;    font-family: Zenhei;    font-size: 39px;    font-weight: normal;    font-style: normal;    text-shadow: #222222 1px 1px 0; } a.button a:hover{      background: #383; } 
like image 586
getaway Avatar asked Oct 10 '10 02:10

getaway


People also ask

How do you change the color of button on hovering?

To change the background color of the button, use the CSS background-color property and give it a value of a color of your taste. In the . button selector, you use background-color:#0a0a23; to change the background color of the button.

How do I change the primary hover color in BTN?

Bootstrap Primary Button Hover Color If you desire to change the styling for the primary button, simply target the . btn-primary class in your CSS file. Any styling you add (i.e. color, background-color, and border-color) will overwrite default bootstrap styling for btn-primary .

How do I change the color of my text buttons?

Use a semi-colon to separate the different style elements in the HTML button tag. Type color: in the quotation marks after "style=". This element is used to change the text color in the button. You can place style elements in any order in the quotation markers after "style=".


2 Answers

a.button a:hover means "a link that's being hovered over that is a child of a link with the class button".

Go instead for a.button:hover.

like image 158
Matchu Avatar answered Sep 18 '22 09:09

Matchu


Seems your selector is wrong, try using:

a.button:hover{      background: #383; } 

Your code

a.button a:hover 

Means it is going to search for an a element inside a with class button.

like image 39
BrunoLM Avatar answered Sep 19 '22 09:09

BrunoLM