Question

I’m usually using an <a> to make block type buttons for example:

a
{
    color:#fff;
    display:block;
    background-color:#ff0000;
}

a:hover
{
    background-color:#c80000;
}

Then I put href="javascript:void(0);" on the <a> tag. I’m doing this because :hover on a div element is not good for backwards compatibility. This being said I was thinking originally to use as little JavaScript as possible but I’m starting to think doing this approach is not a great thing?

What would you guys use?

EDIT:
I only bring this up because I noticed that Google+ was using for some of their buttons.

EDIT #2:
I also noticed on Google+ they have a slight animation on their buttons, so maybe that’s why they are using ‘s

Answer 1

div:hover will work on all browsers except Internet Explorer 6. But that browser is more than 10 years old.

The only downside of using div:hover in IE6 is that they won’t get the hover effect, but they can still use (click) the button. So it won’t break in IE6, just look a little bit different than in other browsers.