- This topic has 23 replies, 2 voices, and was last updated 5 years, 8 months ago by
Tom.
-
AuthorPosts
-
May 22, 2017 at 12:40 am #322025
Mikko
“Also aggregate inline CSS” should be turned OFF to reproduce the problem! You have it on.
Okay, I turned that option off for my site which has very low traffic at the moment:
https://mihku.fi/ihmettele/May 22, 2017 at 12:42 am #322026Tom
Lead DeveloperLead DeveloperAh yes, that keeps the option generated CSS in the head, but adds the combined CSS above it. This makes it so the CSS in the files is overwritten by the generated CSS.
Is there a reason you don’t want to aggregate your inline CSS?
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentMay 22, 2017 at 12:49 am #322032Mikko
No reason! I don’t understand that option, but I get it that ON is generally the best choice.
Only that with that option ON, i needed to tweak your quick fix:
@media (max-width: 768px) { .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { margin-left: 3.8%; } }
With the option ON, this CSS didn’t do anything until I replaced margin-left with padding-left.
May 22, 2017 at 1:02 am #322037Mikko
So I guess that might be a clue for solving the original bug I reported on this thread. Autoptimize doesn’t seem like to that particular piece of CSS for some reason.
Seems to me that both glitches have something to do with margins, and they both happen when WordPress shows many articles/items.
May 22, 2017 at 1:10 am #322039Mikko
Oh yeah: and both glitches only happen on mobile.
May 22, 2017 at 1:26 am #322047Mikko
The two glitches may actually be caused by the same bug.
The first glitch drops the left margin of a product.
The second glitch adds extra left margin for an article. Perhaps you have negative margin in the CSS here?
May 22, 2017 at 11:16 am #322315Tom
Lead DeveloperLead DeveloperThere’s negative margin to the left of the product container. This allows for the edge of the columns to line up with the rest of elements.
You definitely want to aggregate inline CSS if you’re doing other CSS optimization.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentMay 22, 2017 at 11:27 am #322329Mikko
That’s good to know! I’ll stick to aggregate inline.
Okay, then it seems that Autoptimize breaks left margin in both of those places. Since GP’s layout looks fine without Autoptimize, this is probably their bug, not yours.
Can you reproduce the two-column mobile WooCommerce layout problem with Autoptimize? I guess that’s the one that might come back to haunt you in the future. I’m happy enough with my quick fix. ๐
May 22, 2017 at 12:24 pm #322383Tom
Lead DeveloperLead DeveloperShould be fixed in the next version.
Thanks! ๐
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development -
AuthorPosts
- You must be logged in to reply to this topic.