6.7.1. BLEW UP Staging Layout

I disabled the display: flex; in the CSS style for .wp-block-coblocks-row:not([data-columns="1"]) and the inline CSS width: 50%; for .wp-block-coblocks-column.coblocks-column-22134759519.

You can refer to the screenshots below:
https://i.imgur.com/xLT1Tz5.png
https://i.imgur.com/PMwtVof.png

The layout now looks normal:
https://i.imgur.com/SwJAcd5.png

Something is wrong. We’re using Storefront. A very popular Woocommerce theme. We can’t have this kind of thing happening. Have to be honest, I HATE Blocks. smh

Every new software deployed can potentially cause issues with existing code. That’s the nature of this trade: irrespective of what software you’re dealing with. Ever heard of or even experienced new Microsoft or Apple operating system versions causing issues? This potential risk will ALWAYS be present and something you need to brace yourself for.

And this is the whole point of a staging/development site/server — a place to TEST and FIX any issues before deploying to production. This should be a standard practice on any site you care about. Some of us even test the whole Alpha/Beta/RC versions so we can report any issues with any plugin/theme to their developers to fix… so our clients’ sites will be ready by the time the new version of WordPress is released.

As to your issue, this is likely due to a stale cache — very common with new releases. Before making any CSS changes, I’ll recommend flushing every caching mechanism you have on your site: Autoptimize, W3 Total Cache, and anything else doing caching on your site.

Good luck!

Thank you Hank. @poku1010
That’s great you were able to locate it and bypass the issue but frankly I dont know how you are seeing the code for blocks? When I inspect, I do not see any .wp-blocks-coblocks code AT all.

Then too, am I too write what you wrote (though the screenshot is cut off so I can’t see it in its entirety…) in my custom css?

• This reply was modified 22 hours, 10 minutes ago by tabledesigns.

George, (@gappiah )

Not sure why you’re condescending or assuming this ISN’T ON STAGING (Assuredly, it is….) and I SAID SO, in my post …
Nor do I understand why you believe we don’t already have caching functionality or the ability to clear it. ??
Allow me to point you to Wappalyzer – it allows you to see what technology is running on websites.

• This reply was modified 22 hours, 2 minutes ago by tabledesigns.

UPDATE:

So I ran a test page, to add a new row and 4 columns to replicate what we had and learn there isn’t a 4 column layout now? There is only up to 3 …

So I created a row with 2, 50s – and can see I have to rebuild the page.

It didn’t make sense to me that I would have to start revising block code for an update that throws an entire page out of whack inclusivie of alignments.

THIS IS AN UPGRADE?

• This reply was modified 4 hours, 8 minutes ago by tabledesigns. Reason: typo

@tabledesigns

It seems that the layout you’re using is provided by a plugin:
Page Builder Gutenberg Blocks – CoBlocks
https://www.ads-software.com/plugins/coblocks/

I actually installed this plugin and checked its features. However, this is also my first time using it, so the following information might not be entirely accurate.

This plugin provides a 4-column layout.
Based on your current setup, it looks like you’re using a 50-50 row layout, and the first column contains a 4-column layout, as shown in the following link:
https://i.imgur.com/MQjzORq.png

You need to adjust the layout by changing it to a 100-row layout and then nesting a 4-column layout within it, as shown in the following link:
https://i.imgur.com/FltkLXS.png

I hope this information is helpful.