This is what Google says for CSS:
This rule triggers when PageSpeed Insights detects that a page includes render blocking external stylesheets, which delay painting of content to the screen.
So, What is the solution?
1.Do what Google says, Inline the important sections(Not possible here).
2.Load the Files Asynchronously.
What’s the Aim and is it Possible to achieve?
Before we move, we should know what is our aim and what google says. As I said above google wants content above the fold should be shown to a user without waiting for these files to be downloaded means the aim is to reduce the waiting time, Remember the aim is to reduce waiting time, not to get a better Pagespeed score.
Remember It’s always about Improving User Experience.
Is it Possible?
Yes, it is if you wish to reduce waiting time but in case if you wish to improve pagespeed score may be or may be not, depends on some factors.
Fixing the issues using w3 Total Cache (we have written the settings for W3 Total Cache)
1. Navigate to Performance (i.e, W3 total cache) > minify tab,
- Install plugin “Speed Booster Pack” from WordPress Plugin Directory.
- Now Navigate to Settings > Speed Booster Pack
- Now move on to the end of the page, expand the option “Still need more speed?” and enable option “load CSS asynchronously”, this will remove the CSS part error.
- You are done.
There is one more plugin you can use i.e, “Async JS and CSS settings” Download it from Here. But remember it has not been updated from a year now still you can give it a try.
Settings for plugin:
2.Detect <script> tags in wp_head: Disable
3.Detect <script> tags in wp_footer: Disable
4.Load CSS asynchronously: Enable
5.CSS loading method: Leave as it is
6.Minify CSS: Enable
7.Remove “?ver=XXX” part from URLs: Enable
You are done.