Safari not displaying properly

[kyber]

Hi,

the top section of two web pages works fine on Chrome, but not on Safari.
For Chrome, why is there a “jump” to go from the larger font to the right one when loading?
I’m adding info in the secure note.

[ruenel]

Hello @kyber,

Thanks for writing in!

Please go to Cornerstone > Theme Options > Headers > Navbar and set your Top Height to 62 pixels instead of just 46 pixels. The 62 pixel is the actual height of your Logo Text.

Kindly let us know how it goes.

[kyber]

No change on the logo size (still big)
And what about questions #1 and #2?

BTW, WPBakery Page Builder is used to build the page, not Cornerstone.

[kyber]

I fixed the logo issue myself (there was an overwriting CSS). Do you know why the logo in the pricing page picks up a different family font?
Please help on questions #1 and #2 which are the most important.

[tristup]

Hi @kyber,

I have checked the pricing page and found that it is using the font specified with the important only on this page, and that is why the font set to the logo has been overridden.

I would suggest you remove the important keyword to get rid of this problem.

Hope it helps.
Thanks

[kyber]

Ok, I’ll remove that, thanks.
What about the other two issues? Those are the most important ones and never got an answer. the questions are in the first secure note.

[ruenel]

Hello @kyber,

I am seeing this:

• see the secure note below

I guess, the logo issue and your menu bar issue seems to have been fixed already. As for the huge fonts upon loading then then it switches back to normal, that is because you have applied the legacy responsive text like on this “kyber-for-slack” page. You can remove the responsive text and compare the page when it is loaded without it. I would recommend that you check out the new elements and the how you can use the responsive element styling instead.

• https://theme.co/docs/responsive-styling

Best Regards.

[kyber]

How do I remove the legacy responsive text? Somebody else built that page, so I don’t know.
How to I make sure it’s responsive though?

[ruenel]

Hello @kyber,

Please edit your page in the builder and then go to the Settings tab, the GEAR icon, and then you can manage the Responsive Text settings.

Kindly let us know how it goes.

[kyber]

There is nothing in the Responsive Text area

The page is also not loaded as the WPBakery Page Builder has been used for these pages (as someone in your team told me before).

This is very frustrating as we can’t get to a resolution. Please note that only the first top area of the page is affected, while everything else works fine. Can you please login on the account and see what is happening? I’m adding a secure note

[ruenel]

Hello @kyber,

I have investigated your issue and it turns out that the Responsive Text is inserted manually along with the rest of the page content. This were added on the page:
[responsive_text compression="5" selector=".responsive-text-logo" min_size="22px" max_size="36px"]

To get your issue resolve, you will need to edit those affect pages. Just go to Pages > All Pages, hover over the page name and click the Edit link:

You can remove the shortcode which I have indicated above.

Kindly let us know how it goes.

[kyber]

It wasn’t clear which part to remove. Just removing the whole class didn’t work, responsive-text-logo din’t work either, so I just removed the whole thing and added regular text.
Now, on Safari this block is still wrong (see title)

while on Chrome works fine:

It seems more a bug of the theme. Can you fix it or let me know what to do?
Also, can you please remove the screenshots of code and internal pages from previous post of yours and use secure notes?

[ruenel]

Hello @kyber,

Please make sure that you are using the latest version of your Safari browser because on my end, I could not replicate the issue.

Please see the video in the secure note below.

Best Regards.