COMBINE CSS breaks footer and pop-ups

Hi @slysoft, please try to find out the footer and pop-ups’ related CSS and put it into Setting > Tuning > CSS Excludes, you can check this article for more details

I’ve tried but i’m afraid these are not related css files to exclude. Maybe there are other files, or i don’t know…
Right now that procedure break my entire site.

Hi @slysoft, can you show us an image for the broken layout? I compared the minified site and normal site and they are the same.

Hi, Stanley!

I had to stop the plugin and go back to the initial state of the site because it is a production site.
I tried all kinds of css files reported by chrome devtools for the footer and pop-up areas, but the result was devastating.
Maybe I should stop all the other options in Litespeed and start with CSS combine / Asynchronously & Load JS Deferred?
I would like to get a little loading time for the first page of the site in the mobile version. I reduced a lot of the content compared to the desktop version, but I didn’t have much to reduce and I used Litespeed because it is recommended by my hosting service.

Hi,

Please try it this way:

reset setting to default

purge all

only enable cache , no optimization features is ON , and see how it goes.

And then try enable them one by one to find out which one caused issue.

Best regards,

Hi!
I did exactly that.
When I activated CSS Combine, it was broken exactly as described above.
I have deactivated CSS Combine for now and I have not moved on.
What’s next?
Thanks!

That means one some of your CSS files override another’s setting, please try to put the CSS file to CSS excluded one by one to find out which one crashed. Remember to purge the cache every time when you save the setting.

Found one css for footer. Need to search for other related to popups triggered by de side menu icons.

• This reply was modified 5 years, 3 months ago by LRA21. Reason: solved a part

I identified CSS for all popups, I activated each option that followed.
I got to Load CSS Asynchronously. Here pages load text before loading graphics. For a second it looks ugly, you see all the superimposed texts.
How do I solve this problem?
I have also activated Generate Critical CSS as well as Inline CSS Async Lib. Nothing has changed. It loads the same way with that text before.
Also, popups have been destroied. It loads only a white line.
Thanks!

• This reply was modified 5 years, 3 months ago by LRA21. Reason: missing something important

Hi @slysoft, for the Flash Of Unstyled Content issue, please follow this article for the solution.

I followed the instructions in that article, but nothing has changed.
I also tried to disable the Generated Critical CSS, but there is no change

View post on imgur.com

The simplest way to avoid FOUC should be

Load CSS Asynchronously [ON]
Generated Critical CSS [ON]
Generate Critical CSS In Background [OFF]

and then purge all cache.

Disabling Generated Critical CSS will cause FOUC.

@stanleylitespeed
I’ve tried this before. I tried it again now. It doesn’t work for me. It looks the same. Also, sometimes it doesn’t open those popups in the sidebar.

View post on imgur.com

• This reply was modified 5 years, 3 months ago by LRA21. Reason: video added

Hi @slysoft, could you please join our Slack channel for reproducing the issue?

I have joined. Tell me how to use this.
Thanks!