Twenty Twenty-Two, Site Edit, Group with Background Color Overflows Page Size on Mobile

[joshuanan]

When you add a group block with a background color to a footer template in the full site editor, the group block will overflow the page on a mobile device by a few pixels. For example, on a device that is 360 pixels wide will have approximately 10 pixels of overflow. The offending party is this CSS code:

.wp-site-blocks .alignfull, .wp-site-blocks > .wp-block-group.has-background, .wp-site-blocks > .wp-block-cover, .wp-site-blocks > .wp-block-template-part > .wp-block-group.has-background, .wp-site-blocks > .wp-block-template-part > .wp-block-cover, body > .is-root-container > .wp-block-cover, body > .is-root-container > .wp-block-template-part > .wp-block-group.has-background, body > .is-root-container > .wp-block-template-part > .wp-block-cover, .is-root-container .wp-block[data-align="full"] {
  margin-left: calc(-1 * var(--wp--custom--spacing--outer)) !important;
  margin-right: calc(-1 * var(--wp--custom--spacing--outer)) !important;
  width: unset;
}

Where margin-right is the source of the problem. Turning that style off in my browser's developer console eliminates the extra space.