Streaming live at 10am (PST)

Phonenumber text turns blue in iOS & Safari


#1

My phone numbers are in blue color on both my iPad and iPhone using Safari. They are not links, just regular text and are styled to be white in color which is correctly displayed in OS X and Safari.

You can see the site at: http://ystegarncafe.se and scroll down to the footer.

How do I get rid of this and getting the text to be white on mobile devices? I believe they were links before, but that I removed them....so..can it be something related to cache?


#2

While having that link selected give it a class and set it's color to white and no underline. If you eg. have a color: #f9f9f9; and it is shown as orange (inherited) then you can remove the last 9, press enter and type it back and press enter. That way it will have a forced color: #f9f9f9; for that selector :)


#3

Safari on iOS does some screwy stuff with numbers that are hard to override and does not respect CSS styling for certain elements in strings. I have had the same issue with dates as well. iOS recognizes elements in strings in HTML and generates the highlighting as a feature to enable the user to add a date or phone number to contacts, reminders and ical. I couldn't find a quick work around in a cursory search, but I feel pretty sure someone has created one. If the text doesn't need to be live, you could always outline the text and convert to an SVG in a graphics app. Just remember that doing so would disable screen readers.

There should be a browser class (not sure what the proper term for that is) for those elements. If you knew what the class was called you could override the built in class with custom code and style it any way you choose. You will likely need to use !important after the property to force override the built in / browser class thingy.


#4

Hi @StevenP, also check out this related post: http://forum.webflow.com/t/ios-update-adds-a-new-feature/10385 smile


#5

I completely forgot that was in the link panel - thanks Dave! Any suggestions on how to handle dates in iOS?


#6

Hi @vlogic, thanks for the update smile Well, in what way do you want to manipulate the date in iOS? Currently we do not have a date/time picker widget for forms, but it can be made custom.

I would check out a couple of articles on stackoverflow:


I hope that helps smile Cheers, Dave


#7

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.