0

I have looked around for the answer and a close article was this: HTML links not clickable on mobile, but are clickable on desktop

On my site: https://venueswl.com/

In the footer (only on an actual mobile device) the mobile and email links are black. However across desktop and laptop, these links are white and correctly working.

I can't see any blinding errors either using the inspect element on Google.

Any ideas?

Elliot Beech
  • 25
  • 1
  • 5
  • Please add relevant code of what you have already tried – SuperDJ Aug 16 '18 at 13:59
  • I assume you're talking about the phone numbers on the footer. Viewing the website through Chrome's device viewer unfortunately does not reproduce the problem, however viewing it directly on my phone _does_ reproduce it. Have you tried applying inline style rules directly on the phone numbers to override the default OS styling? – Joel Rummel Aug 16 '18 at 14:07
  • No I haven't, can I apply this directly to WordPress? @Epicular – Elliot Beech Aug 16 '18 at 14:34
  • Tel +44 (0)20 8254 4800 Fax +44 (0)20 8254 4801 Skypewhite.light.sw19 – Elliot Beech Aug 16 '18 at 14:35
  • If that's the code you're using now and the phone numbers are still appearing black, then I'd take a look at [this](https://stackoverflow.com/questions/3736807/how-do-i-remove-the-blue-styling-of-telephone-numbers-on-iphone-ios). – Joel Rummel Aug 16 '18 at 14:45
  • Ok so I am looking at this answer: a[href^="tel"] { color: inherit; /* Inherit text color of parent element. */ text-decoration: none; /* Remove underline. */ /* Additional css `propery: value;` pairs here */ } This website is on a theme, can I apply this to the theme css file? – Elliot Beech Aug 16 '18 at 15:05
  • That is a CSS rule, so yes, you would be able to. But it won't work unless the anchor's `href` value starts with `tel`. Also it'll continue to have no effect if you leave the `color: #ffffff !important` attribute. But if the `!important` still doesn't work, then I have no idea what CSS trick would. I gotta imagine that WP is still messing with the style somehow (I don't use WP so I wouldn't know). – Joel Rummel Aug 16 '18 at 15:44
  • Ok so I have put this now:

    Tel +44 (0)20 8254 4800 Fax +44 (0)20 8254 4801 Skypewhite.light.sw19

    I have also applied this to the theme itself: a[href^="tel"] { color: #fff !important; text-decoration: none; }     – Elliot Beech Aug 16 '18 at 16:05

0 Answers0