After updating Bricks to v2.0.2, the Cart, Checkout, Checkout Thank You (checkout/order received) and Empty Cart pages have some bad CSS that makes margin-left: -10%, width: 120% and max-width: 120%
This pushes the page out to the right and causes the horizontal scroll bar to appear.
Watch the Video: Jam
Hi Mark,
Thanks so much for your report!
You have inserted either the cart block or the “Classic cart” in Gutenberg and not [woocommerce_cart], as described in the academy, right?
Did it really work without overflow before 2.0.2?
Best regards,
timmse
It has always worked like this without putting the shortcode in. It says it renders the classic cart short code, so I thought it was the same thing.
It’s always worked like this and updating to 2.0.2 causes the problem.
This is the CSS with v2.0.1. The CSS is revered and overrides the bad CSS.
After I click the “transform into blocks” button, then delete the block and add the shorcode in the shorcode block, it renders correctly.
It says the same for Checkout.
So, I found that I can delete that block without converting it. I didn’t know that because it didn’t appear to be a block. The popup message made it appear it wasn’t a block that could be deleted.
I think the Academy needs to update and explain it a bit more specifically that this is what the classic shortcode block looks like and ignore the message that says it will render the classic cart shortcode and delete it anyway.
As far as I can see, you are the first to use the “Classic Checkout” block - at least we haven’t received a report on this yet, as far as I know.
The instructions in the Academy are actually pretty clear (at least to me)
Please remove all of the gutenberg blocks and use
[woocommerce_cart]instead.
Even if it worked before 2.0 (or better said before cascade layers), it’s not the correct setup and therefore not a bug 
I am using this as well. You just need delete class “alignwide”
It says right on the blocks that: “the block will render the classic cart shortcode” and “the block will render the classic checkout shortcode”. It should be mentiond in the academy docs that this should be ignored. It is really not all that clear unless you know to ignore this.
Agreed.
I noticed that removing this class from the DOM fixes it… but how can we actually prevent this class from being added to the block cart?
I think this needs to be looked at and should be considered a bug… using the shortcode renders a very dated looking cart while the blocks give something sharp and modern… Yet I’m struggling with this negative margin problem too.
No, this should not be considered a bug, as it has worked this way from the beginning.
The new shopping cart and checkout blocks have not yet been integrated—however, there are already improvement requests that we will look into in due course:
