Code Editor Causing Layout Shifts

[simeoned]

Using the CSS code editor is consistently causing the global container’s max width to be suddenly ignored pushing the content full edge to edge while working. To be clear, I don’t mean actually writing any CSS that would cause max width of the container to be overridden, I mean that just making a line break in the editor causes the layout to shift (or link text to turn white in one case).

Here are the steps I take:

1. Open a CS document
2. Open the CSS code editor
3. Insert cursor into the end of the document
4. Make 2 line breaks in preparation to write a line of CSS
5. Global container’s max width stops being enforced, content snaps suddenly to edge
6. Save the document as is
7. Reload the front end, observe that visual artifact is not real
8. Reload the builder, max width is back to normal
9. Repeat, consistently happening

Here is a short video showing what I’m talking about:

To reiterate, I am not able to give access to either of these sites at this time. Please do your best to answer this concern based on this video and the description I am providing here.

Thank you!

[prakash_s]

Hello @simeoned,

Thanks for writing to us.

I followed the steps you mentioned, but I was not able to replicate the issue on my end. I tested it on WordPress 7.0.4 with Pro theme 6.9.1, PHP 8.2.4, and Google Chrome browser version 151.0.7922.109. I would suggest cloning the website to a staging server and sharing the staging server admin credentials so we can check it without affecting your live website. Please provide the following details

• WordPress Login URL
• Admin-level username and password

You can find the Secure Note button at the bottom of your posts

Thanks