# postcss-require-hover

**Repository Path**: mirrors_JetBrains/postcss-require-hover

## Basic Information

- **Project Name**: postcss-require-hover
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-08-09
- **Last Updated**: 2026-02-14

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# PostCSS Require Hover

[postcss]: https://github.com/postcss/postcss

[PostCSS] plugin that wraps hover selectors in a media media that's only valid on devices that support true hover events. The goal of this plugin is to prevent mobile browsers (mostly iOS) from getting their hover states "stuck" since hover.

Original idea: https://www.quirksmode.org/blog/archives/2012/11/what_the_hells.html

More explicit support for this feature: https://drafts.csswg.org/mediaqueries/#hover

Tested:

-   IE11
-   Chrome
-   Safari
-   Firefox
-   iOS - Safari/Chrome
-   Android - Chrome

## Example

```css
.foo {
    bar:hover {
        display: block;
    }
}
```

```css
.foo {
    @media (hover: hover), (-moz-touch-enabled: 0), (-ms-high-contrast: none), (-ms-high-contrast: active) {
        bar:hover {
            display: block;
        }
    }
}
```

## Installation

```
npm install postcss postcss-require-hover
```

## Usage

```js
postcss([require("postcss-require-hover")]);
```

See [PostCSS] docs for examples for your environment.