Grey highlight on clickable elements

Text links, png buttons –¬†everything has a grey background when you tap it on mobile webkit browsers. While this can server some usability functions, sometimes it’s just getting on your way. Lets say you have a fancy shaped button with some transparency.¬†There will be grey background in the transparent area, whenever the user taps on that button and that definitely would look ugly.

The solution is as simple as adding: -webkit-tap-highlight-color: rgba(0,0,0,0); to your buttons, links or everything if you want.

Safari Web Content Guide – Highlighting Elements

Leave a Reply

Your email address will not be published. Required fields are marked *