Phone Number Not Visible in iPhone Safari — How to Fix

Category: Apple
Posted: October 2, 2014
Author: Antonio

It turns out that Safari on the iPhone automatically turns phone numbers on web pages into links, and that can cause all sorts of trouble.

iPhone 5S box

For example, links on my site were white by default, and the phone number in Safari blended into the background — white on white.

How to fix it

There are a few ways.

1. Style phone links in CSS. For example, to make the number look like the regular text around it:

a[href^="tel"] { color: inherit; text-decoration: none; }

The number stays a link — you can call it with one tap, which is actually handy on a phone. A reader confirmed this method in the comments: numbers were invisible on a black background too, and the CSS style fixed it.

2. Turn off number detection. Add this meta tag to your site template, in the <head> section:

&lt;meta name=&quot;format-detection&quot; content=&quot;telephone=no&quot;&gt;

Then Safari will stop turning numbers into links.

Some people put their contacts in an image, but in my opinion that’s a bad option: you can’t copy such a number or send it to someone over ICQ or Skype, for example.

Related posts:

Leave a Comment

Copying content from this site is allowed only with a direct link to the source - https://nemcd.com