ASP.NET button does not have hover state?

Question

I checked the link at Asp Button hover and CSS but to my frustration, I still couldn't find a solution to apply CSS to the hover state of my ASP.NET button.

My button is declared like so:

    <asp:Button ID="btnRegister" runat="server" 
                 onclick="btnRegister_Click" CssClass="btnRegister"/>

My CSS for the button is:

.btnRegister {
    background-color:#FFF;
    color:#000;
}
.btnRegister : hover{
    border:solid 2px #000;
}

.btnRegister : active{
    background-color:#000;
    color:#FFF;
}

When I inspected the button in FF and IE, I saw the styling is only done on the button, not on the button when hovered.

Furthermore, I have a skin file applied to the page which holds the button but it is applied to other controls, not the button.

Anyone got any ideas on how to access the hover state of the button?

Sebastian Patane Masuelli · Accepted Answer · 2010-11-22 03:49:04Z

5

take out the extra blank spaces between the class name and the pseudo-state:

.btnRegister {
background-color:#FFF;
color:#000;
}
.btnRegister:hover{
border:solid 2px #000;
}

.btnRegister:active{
background-color:#000;
color:#FFF;
}

answered Nov 22, 2010 at 3:49

Sebastian Patane Masuelli

4,2571 gold badge21 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

tshao · Accepted Answer · 2010-11-22 03:48:53Z

3

Hey, just remove the space before and after the 'hover' and 'active', and you get it.

.btnRegister:hover
.btnRegister:active

answered Nov 22, 2010 at 3:48

tshao

1,1272 gold badges8 silver badges23 bronze badges

Comments

Jason Li · Accepted Answer · 2010-11-22 03:46:04Z

1

jQuery

$("button").hover(
  function () {
    $(this).css("your style");
  }, 
  function () {
    $(this).css("origin style");
  }
);

Hope this can help.

answered Nov 22, 2010 at 3:46

Jason Li

1,5851 gold badge12 silver badges20 bronze badges

3 Comments

fred Over a year ago

I tried and it did work but I wanted to keep it simple. Thanks for the correct suggestion though.

Jason Li Over a year ago

@fred It seems like IE only supports a:hover. So you want to use css to achieve the goal may be a little difficult.

fred Over a year ago

That's true...I just found out about that...sigh

Collectives™ on Stack Overflow

ASP.NET button does not have hover state?

3 Answers 3

Comments

Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related