Why not hand when hovering link(<a>)?

Question

Hi,

I know that its possible to set the cusor to hand when hovering an object like this:

CSS :

cursor:             hand;
cursor:             pointer;

This should be done automaticly with a link element that looks like this :

<a onclick="" class="btn1">
  <span>Sök</span>
</a>

But In my case its not?

With firebug I can see that the followin CSS is applyed

<a> element
a.btn1 {
    background: url("Images/Menus/bg_button_a.gif") no-repeat scroll right top transparent;
    color: #444444;
    display: block;
    float: left;
    font: 12px arial,sans-serif;
    height: 24px;
    margin-right: 6px;
    padding-right: 18px;
    text-decoration: none;
}
* {
    margin: 0;
    padding: 0;
}
body {
    font-family: Arial,Verdana,serif;
    font-size: 0.81em;
}

And

SPAN element
    a.btn1 span {
        background: url("Images/Menus/bg_button_span.gif") no-repeat scroll 0 0 transparent;
        display: block;
        line-height: 14px;
        padding: 5px 0 5px 18px;
    }
    Controls.css (rad 80)
    * {
        margin: 0;
    }

    a.btn1 {
        color: #444444;
        font: 12px arial,sans-serif;
        text-decoration: none;
    }

    body {
        font-family: Arial,Verdana,serif;
        font-size: 0.81em;
    }

How can I track down this problem?

BestRegards

Answer 1

The hand appears only if the ANCHOR has a href attribute set.

Live demo: http://jsfiddle.net/KAEbR/