So I have a page setup with tiles/buttons in the main body section. These tiles have a :hover state and a :focus state. Focus state was added for accessibility purposes.
Weird problem I'm having is when users scroll down the site on mobile browsers, if their thumbs are touching the tile/buttons when scrolling down, then the :focus state gets triggered and the tile looks clicked or activated.
Is there a way to disable focus state activation on scroll and only activate on a direct tap or touch?