Beware: Mobile Safari’s phone detection changes the DOM and can mess your CSS styles

Leo Soto
Leo Soto
Nov 17, 2011 · 1 min read

Posted by Leo Soto on November 17th, 2011.


This is just a quick tip which hopefully can make someone save a few hours of pain: If you have a webpage which works perfectly on every decent browser on the earth (that excludes IE6, of course) but, which has some CSS issue on the iPhone and iPad, and only on the devices running iOS5, the likely reason behind the issue is that Mobile Safari is changing your DOM

Long story short: Remember that nifty iOS feature in which you simple tap a phone number inside a web page and your iPhone immediately calls such number? Well, Safari does that by modifying your DOM. In my particular case, it messed a float style in a web page I’m maintaining.

Ironically, by messing with that little float, the phone numbers presented in our webpage became totally messed up, so you couldn’t tap nor read them. There you have another evidence that we are still a long way from having real artificial intelligence ;)

Anyway, if you don’t want Safari to mess with your DOM, simply put the following meta tag in your HTML:

<meta name="format-detection" value="telephone=no">

And well, if you still want your users to tap on phone numbers, simply do the markup explicitly in your code, like this:

<a href="tel:1-404-123-45-67">123-45-67</a>

Originally published at techblog.leosoto.com on November 17, 2011.

Leo’s Tech Blog

A personal blog on tech stuff.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store