The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Conditional CSS for touch screen devices? Reply To: Conditional CSS for touch screen devices?


According to this article…
… we can now use the @media (hover: ... attribute.
Unfortunately it’s still not supported on all browsers (but luckily most)…
But the last answer to this question…
… offers a very simple solution that allows for hover styling and non-hover-fallback styling.
With this bit of JS…
const canHover = !(matchMedia('(hover: none)').matches);
if(canHover) {

And then this bit of CSS…

.myElement {
background: blue;
.can-hover .myElement:hover {
background: red;