Should the cursor property be set in a rule with or without the :hover pseudo-class?

Question

Say you, or I, have coded an HTML element...

<a id='hydrogen' href='#'>H</a>

...and some :hover CSS...

#hydrogen:hover {
  background:red;
}

...and now we want to put a fancy hand cursor when hovering. There's two options for this:

apply to stateless element:

#hydrogen { 
  cursor:pointer;
}

or, apply to :hover state.

#hydrogen:hover { 
  color:red;
  cursor:pointer;
}

My question: is there any reason(s) why one way is decisively better than the other?

...or is it tomato, tomato?

Answer 1

Compatibility: IE6 and below only recognize the :hover pseudo class on a elements.

Answer 2

They are both the same, provided you always want the pointer there, reguardless of hovering.

The :hover pseudo class will inherit cursor: pointer from its non hovered state.

I would prefer to put it on the normal selector, rather than :hover.

Answer 3

Both ways are equally good. However i would put it on the id itself as :hover does not work on ie6 or below if element is not an anchor. If you do not care about older versions of IE. Then both ways are correct.