Font color phone number difirent on smart phone

Support
#1

Hi there, I am working on my contact page: https://www.flowdivision.com/contact/
and the phone number shows up in bleu (red link) on a smart phone, this is should be white.

I tried the code below, but this not working.

a[href^=“tel”] {
color: #fff;
}

Thank you for you support!

#2

Hey @flowdivision,

The numbers I see on that page are white both on desktop and mobile.

Thanks.

#3

Hi there,

my contact page: https://www.flowdivision.com/contact/
and the phone number shows up in bleu (red link) on a smart phone, this is should be white.

#4

Hello @flowdivision,

Thanks for updating the thread. :slight_smile:

I am also unable to replicate color change on my end too. Please see screenshot. https://screencast.com/t/hcLeiLzJ
have you tried clearing cache?

However if it’s still showing up on your end then please try changing the font color and see how it goes. You can do that under Text Style > Text Color. https://screencast.com/t/NnR0puCugW

Thanks.

#5

Hi there,

Thank you for your response.

Color change is still there after clearing cache, also changing colors doesn’t help.

I have no idea why problem isn’t showing on your end? Can’t I try a CSS code?

Thanks

#6

Hi There,

Would you mind to specify what smartphone and browser you’re using? so we can try to replicate the issue.

We knew iOS changes a phone # color, it is also possible that one of your apps is causing that.

Please add an !important statement on your CSS code above, and put it on top of all your custom CSS.

a[href^="tel"] { 
    color: #fff !important; 
}

Then clear your browser’s cache again.

Hope it helps,
Cheers!

#7

Hi There,

I did put given CSS code with !important added, on top of all other custom CSS (line 1) and now it’s working. Thank you!

To test, I first put the given CSS code with !important added on the end of all my custom CSS and it didn’t work, does this mean I have some bad custom coding somewhere?

I use a Iphone 6 with iOS 11.2.1

Thank You!!

#8

Hi There,

Yes, if the given CSS code works when you put it on the top, then that means there is a syntax error somewhere on your custom CSS.


You can always check your custom CSS here: http://csslint.net/

Hope it helps,
Cheers!

#9

It did help a lot, Thank You!!

#10

You’re more than welcome, glad we could help.

Happy Holidays, Cheers :slight_smile:

#11

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