FOUSC on my desktop menu

Hi! I’m getting a flash of unstyled content on my desktop header menu. I’m using WPRocket defer/delay JS but I’m not sure if it has anything to do with it. Would you be able to help me figure out what’s happening? Thanks! (url in the private content)

Attachments:

You must be logged in to view attached files.

Hello,

We just tested your website and there is no flash of unstyled content for your desktop menu. Its CSS code is loaded before the actual menu so it works correctly. You may confuse it with the loading of menu icons. So this effect is caused by the lazy loading of your images.

Kind Regards

Hi! You’re right about the lazy loading, I should probably exclude those icons. However, please see attached what I meant and let me know your thoughts. Thanks!

Attachments:

You must be logged in to view attached files.

The first screenshot shows that our WoodMart font with icons is loaded after the header. It may be due to the “swap” option enabled for the WoodMart font in Theme Settings -> Performance.

Kind Regards

Just checked and font swap is disabled. I actually care more about why 2 of the longer texts are stacking on top of each other.

The text will be fixed when you disable lazy loading for images.

That worked! Thanks a lot for the help!

You are welcome! Feel free to contact us if you have any further questions.

Kind Regards

[Author]

Posts