Search code examples
iphonehtmlcssresponsive-designmedia-queries

numeric content being stripped out/hidden on tablet/mobile devices


I have a broblem with this site where, on an iPad 3 and iPhone 4, I am finding the the mobile number is being removed/hidden when the element only contains a numerical value. When I prepend the value with "mob-" it works.

<span class="r" style="width: 100%">mob-0123456789</span>

So, when I have it like this below it doesn't show:

<span class="r" style="width: 100%">0123456789</span>

I have raked through my @media queries, but I can't find anywhere that is preventing it from displaying. The site is responsive so there are a number of @media queries for different screen sizes. It displays differently on an iPhone as it does on an iPad, but the hidden numeric content is the same on both.


Solution

  • In reference to How do I remove the blue styling of telephone numbers on iPhone/iOS?

    If you add the following to the meta tags, this should resolve the issue.

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