Text Invisible On Mobile

Hey guys,

I’ve built a site in XPro, but I’m having some mobile responsiveness issues. The headlines/text on my page as well as in the footer on tablet/mobile screen sizes (apple/safari) are showing up completely transparent. I can highlight over the text, so I can see it’s still there, but it’s invisible. I checked to make sure none of my content was hidden on mobile screens and it’s not. I’ve also checked for plugin conflicts, but there were none. Any ideas as to what’s happening?

Thank you for your help!

Hello @ancorakim,

Thanks for writing in!

It seems that you are using the headline element incorrectly. Please edit you page and remove any heading tags in the content. Instead of using this:

<h2 style="text-align: center;"><span style="color: #007041;">SERVICE PACKAGES</span></h2>

You only need to insert this plain:

SERVICE PACKAGES

The heading tag must be set in the headline element settings.

It can be aligned to the center and apply color in the Text Style options.

Hope this helps. Please let us know how it goes.

I have applied your suggestion to two sections (Service Packages and Assessments + Reports). It worked on Service Packages but I can’t see Assessments + Reports still. Here are some screenshots of what I can/cannot see:


And now I am receiving this message:

I have removed all iframes from the page and still get this message.

The iframe issue has been resolved. I think it was just being glitchy. But the issue still persists that text can’t be seen on Safari.

Hi @ancorakim,

The issue is not happening on my end. Try clearing your mobile browser’s cache, and all caching feature you might have.

Thanks,

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