evening Keith;
Concerning the full CSS not loading; it could be the CSS-files are not loaded, it could be they’re not being inserted or it could be that there’s a conflict between the critical CSS and the deferred on. Have a look in your developer console; in FF for example in the Stylesheet tab you can see all CSS-files that are loaded. What you can also do, to get an idea of what is (not) happening, is leaving the inline CSS blank. If the deferred CSS doesn’t load after a couple of seconds max, have a look at the browser (error) console for any JS errors (as the deferred CSS is injected by JS).
Regarding critical CSS for woocommerce product pages; no idea … in a widget maybe?
hope this helps,
frank
Thanks Frank
Had a look and think it is loading alright. For what ever reason the crtical CSS seems to break the theme. Can’t seem to isolate the issue at all.
well, if you can share your URL I can have a quick look if you want?
That would be great Frank
https://www.magva.com
ok, the problem (vertically aligned bottom widgets) is even present when AO is not active (you can see by adding ?ao_noptimize=1 to the URL.
the issue is with this block of inline CSS;
[class*=pl-col-] {
-webkit-order: 3;
-moz-order: 3;
-ms-order: 3;
order: 3;
-webkit-flex-basis: 100%;
-moz-flex-basis: 100%;
-ms-flex-preferred-size: 100%;
-ms-flex-basis: 100%;
flex-basis: 100%;
padding-right: 1em;
padding-left: 1em;
max-width: 100%
}
remove that and the bottom widget are aligned horizontally 🙂
following up on that; the problem seems specifically triggered by that;
max-width: 100%