CSS Formatting Breaks After Duplicating A Block Twice Part 1

My site has right and left side-bars that display user information. I am using wp 2023 theme, block visibility and gpblocks.

I create the first side-bar layout of user information, then I simply duplicate the first block 3 times to create a total of four blocks with the same exact user profile layouts. From there I simply change the name and other information related to whatever user for blocks #2 through #4.

(Using a grid, with 4 containers)

Block #1 = original layout
Block #2 = duplicate (css displays perfectly, I can change the name & profile info)
Block #3 = duplicate (css displays perfectly, I can change the name & profile info)
Block #4 = duplicate (quite consistently, css is broken and no changes within Gutenberg editor can repair the layout)… I literally need to use the Simple CSS plugin and manually re-code the in order to get it to display properly… which as you can imagine is aggravatingly time consuming.

I have attached two screenshots, clearly displaying the layout “breaks” from Block #3 to Block #4.

This is a screenshot of Block #3 showing exactly how the layout should look

To Be continued… I am limited to one embed… ?

Hi @dragonsway,

Have tried regenerating CSS files in GenerateBlocks > Settings?

Hey hey @fernandoazarcon2 I tried that… had no effect… The only “workaround” that I could find so that I don’t manual hand code all the css was go to the wp page list, find whatever page that I am editing, click “quick update”, and simply update it… not changing a single thing. Saving the page in Gutenberg does not when this bug shows up. In gutenberg,… the generateblocks text changes show up on the displayed pages as expected… but the images are mangled as shown… and -no- changes to generatepress block images inside of gutenberg will be shown.

Definitely, moaning about this one… when copy and paste is broken… there is a deeper issue… costing me precious time.

This is indeed odd.

To clarify, are you copying and pasting the Blocks or are you duplicating them?

If you’re copying and pasting, I would recommend duplicating instead.

Can you also try choosing Inline Embedding for the CSS Print Method in Settings > GenerateBlocks?

I don’t usually like to resurrect older posts, but this was the same issue I’ve been experiencing.

Though I managed to fix the CSS issue by using your suggestion of choosing Inline Embedded.

The CSS classes were not being added to a button that was “Duplicated” 2+ times. I was comparing them with Chrome’s Inspector, and the ones without the proper formatting were missing a couple of CSS attributes that the ones that did work had.