Issue: Hover styling applied to button on the touch screen.


I notice an issue with the hover state on a touch screen device where the hover styling is applied and occurs when toggling a button (e.g. a navigation menu).

This issue only occurs when a user exits the navigation menu or selected a button on the same page.

A hover styling is presented and disappears when clicking away from the button.


While "@media (hover) and (pointer: fine)" media queries do fix this issue. 

 
@media (hover) and (pointer: fine) {
    button:hover {
        background: yellow;
    }
}

I am on the assumption that the CSS hover should only apply to devices with a mouse cursor, etc.


Please correct me if this is wrong.