I've noticed that sometimes if an element has css rules defined for its :hover state on mobile browsers they are applied whenever an element has focus. Is this expected behavior?
Asked
Active
Viewed 291 times
1
Max Koretskyi
- 101,079
- 60
- 333
- 488
1 Answers
2
According to W3, :hover is applied when "some pointing device" is placed over the element:
The :hover pseudo-class applies while the user designates an element (with some pointing device), but does not activate it. For example, a visual user agent could apply this pseudo-class when the cursor (mouse pointer) hovers over a box generated by the element. User agents not supporting interactive media do not have to support this pseudo-class. Some conforming user agents supporting interactive media may not be able to support this pseudo-class (e.g., a pen device).
W3 src
So, no, :hover might not, and is not on some, supported on mobile devices.
You should use :focus instead.
Does css hover work on mobile devices?
