I have the same problem and started the same topic here at woocommerce support, since we don’t know if it’s w3tc or woocommerce causing this:
http://wordpress.org/support/topic/minifying-woocommerce-smallscreencss-breaks-styles?replies=1
WooCommerce uses the optional $media parameter of wp_enqueue_script: https://codex.wordpress.org/Function_Reference/wp_enqueue_style.
W3TC completely ignores this, so I’m guessing that it’s a W3TC issue and it’s not related to WooCommerce. The solution is to only combine files which have the same media attribute.
See also:
- https://github.com/woothemes/woocommerce/blob/9a115dc1f4b984e8249c8bbd7a612669055bc249/includes/class-wc-frontend-scripts.php#L38
- https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries
Thanks a lot for your reply Nikolay!
So that would mean that minification of all css is not possible with this woocommerce-smallscreen.css file inlcuded and only combining css files will be possible untill w3tc software will take optional $media paramters in account?
Yes. Right now the only solution is to exclude this file so that it’s not minified.
Ideally, it would be great if it can be minified without stripping the media attribute from the <link> element.