Recently, I was working on some custom coding for a client who created their site in Divi. We added a phone number to a widget area, but no matter how or what we used in the CSS, the color always came up as GRAY on iPhone Safari. After quite some time, I found the answer! Seems Safari auto detects phone numbers and formats them as a link – even if they are not an actual link. Thankfully, the solution is pretty easy!
1. Add this to the <head> section of your website. In Genesis, you can do this in the Genesis > Theme Settings panel.
<meta name="format-detection" content="telephone=no">
2. Then format the phone number as a link manually like this:
<a href="tel:111-444-5555">111-444-5555</a>
3. Add this to the CSS
a[href^="tel”] {
color: #fff;
}
VOILA! Problem solved!
Leave a Reply