how can css reset :hover to default state?

Question

I have the following rule:

.quiz .panel .choices a:hover,
.quiz .panel .choices a:active {background-position: 0 -30px;}

And because of the well documented weirdness that iOS does when it interacts with :hover. I want to reset the <a> tag to its normal CSS state for iOS. In my page, javascript will inject a class called 'iOS' at a top level so my following rule that will overwrite would be:

.iOS .quiz .panel .choices a:(?????)

the question marks being the part I don't know. What CSS rule do I write that resets the <a> tag so the pseudo classes are at their default state?

Answer 1

I didnt really understand your question, but the 4 options you have are

a:link
a:hover
a:active
a:visited

my guess is you need

.iOS .quiz .panel .choices a:link {background-position: 0 0}

Answer 2

No pseudo-class at all. Just use:

.iOS .quiz .panel .choices a

It will be the selected rule when "hover" doesn't happen! :)