Highlighted

Font not showing on Safari on iOS! Help!!!!!!!!!

Explorer ,
Jun 09, 2017

Copy link to clipboard

Copied

Hi,

I finished to setting up a website for a client but there is a problem:

I don't know why, but on the tablet or phone (landscape), the phone/fax numbers in the header are invisible... They are present, but in white so we don't see them. Do you guys know what could be the cause?

I checked, and apparently it's only doing that with Safari on iOS!  No problem when using Chrome or Firefox on iOS... Very strange.

The font is Arial, but I tried with another fonts and it does not work.

Please, help me.  Thank you!!!

Here is the website link: https://www.gedo.fr/

IMG_0221.png

Views

1.1K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Font not showing on Safari on iOS! Help!!!!!!!!!

Explorer ,
Jun 09, 2017

Copy link to clipboard

Copied

Hi,

I finished to setting up a website for a client but there is a problem:

I don't know why, but on the tablet or phone (landscape), the phone/fax numbers in the header are invisible... They are present, but in white so we don't see them. Do you guys know what could be the cause?

I checked, and apparently it's only doing that with Safari on iOS!  No problem when using Chrome or Firefox on iOS... Very strange.

The font is Arial, but I tried with another fonts and it does not work.

Please, help me.  Thank you!!!

Here is the website link: https://www.gedo.fr/

IMG_0221.png

Views

1.1K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jun 09, 2017 0
LEGEND ,
Jun 09, 2017

Copy link to clipboard

Copied

This might have many reasons.

Do the following: Create a new site with only one page and only your header, to demonstrate your issue, or reduce your existing site to only one page, containing only the header elements, which demonstrate your issue. (This is necessary, because it saves download- and analysing-time). Upload this .muse file (without assets) to Dropbox or a similar file sharing service and provide the download link here. Then we can have a closer look.

Thus, time consuming „question and answer“ games or pure guessing can be considerably reduced.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 09, 2017 1
Guide ,
Jun 09, 2017

Copy link to clipboard

Copied

The reason is iOS is converting the numbers to links (it does this!). It's likely the Normal state colour is set to the same as your background colour.

Create a new default link preset with contrasting colours.

David

Creative Muse

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 09, 2017 1
Guide ,
Jun 09, 2017

Copy link to clipboard

Copied

You can also turn off Safari's auto number linking by putting the following code in the HTML for <head> section of the page properties - it's best to do this on your master page so it applies to all pages.

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

David

Creative Muse

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 09, 2017 1
Explorer ,
Jun 09, 2017

Copy link to clipboard

Copied

I agree with both answers, however you can try to "hide" the element on that particular breakpoint (mobile 380px 320px or whatever you choose to) and create another element with its own properties (such as color, size and position) as suggest and upload the project and test it. You might get it right, otherwise I agree with

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 09, 2017 1
Explorer ,
Jun 09, 2017

Copy link to clipboard

Copied

Hello,

Well, thank you so much, I will try and I will let you know what happened.  Thank you!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 09, 2017 0
Adobe Community Professional ,
Jun 09, 2017

Copy link to clipboard

Copied

Wasn`t it the same reason as with the "pizza thread"? That it detects those numbers as links and sets them to white because of the site properties?

So why not do not for virtue and make the phone number a real button, link it to the phone number and people can call directly without hazzle?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 09, 2017 1