Inline CSS gets added to blocks (randomly?)

Sometimes, the transform property (more specifically the translate value) doesn’t get reflected inside the editor.

The reason:

image

After refreshing the page, it’s working again.
Not sure what this is causing and if it is a bug or not.
Maybe there is some explanation.

Hi,

I also found this CSS applied to an img tag, preventing custom z-index to work…

Thanks for confirming that it’s not only me.
There are also other CSS variations from what I posted above.
Sometimes, it even prevents me clicking blocks on the canvas.

Again, refreshing has always been worked.
Turned this into a bug report and tweaked the title, as this needs to be investigated.

Hi @Marius,

Apologies for not reacting to this.
Could you possibly give me a more precise pathway to reproduce it? I can’t quite imagine where we’re adding these inline styles.

Thanks.

Sorry for the lack of info in this case @Louis.
Initially, I wasn’t sure if it’s a bug, so I quickly threw something in.

Will update with hopefully more info and context , as soon as I’m facing it again.

1 Like

Hourra!!! Found a very simple way to reproduce this:

  • Insert an image at the end of non-empty section and inspect CSS: everything is OK.

  • Now move the image up and inspect CSS: BOOOM :slight_smile:

EDIT: It seems to happen with ANY block which is moved in the structure panel, maybe to make it stand above the others when moving? But should be reset when released.

1 Like

Wow, not sure if I ever figured that out.

I can confirm that but seems not to be consistent on my side.
It also sometimes gets added to blocks which are moved passively (when other blocks are moved).
Definitely a solid point to start investigating. Thanks a lot @yankiara.

Please don’t let this be a Gutenberg behaviour/limitation which can’t be addressed :unamused:

1 Like