Question

When touching a link or anything with an onclick event in mobile safari a dark gray box appears over the element. What is this called and what CSS selector can I use to get rid of it.

Thanks!

Answer 1

It’s the -webkit-tap-highlight-color. Here’s a little extra info for you:

http://css-infos.net/property/-webkit-tap-highlight-color

/* webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #aa0000; }

/* To set it to none use a totally transparent RGBA */
a:link { -webkit-tap-highlight-color: rgba(0,0,0,0); }

You can also check out the Safari Mobile developer docs to see the supported CSS properties.