Twenty Twenty-One: heading nested inside cover width discrepancy in Editor

[mrfoxtalbot]

Headings inside a cover block appear too wide in the editor, but look fine later in the published post.

To reproduce

• Create a new post or a page. Add a cover block, set the cover block to Full width.
• Inside the cover block add a headings block.
• For comparison, add a paragraph block below the heading.
• Notice the different width and alignment between the two.
• Save draft and go preview the post/page. Notice the paragraph and heading are both the same width.
• A similar thing happens when headings block is nested in the group block set to wide or full width.

Expected behavior

For the editor to match the preview.

This bug was reported originally here ​https://github.com/WordPress/gutenberg/issues/25937

[mrfoxtalbot]

Twenty Twenty-One: heading nested inside cover width discrepancy in Editor

[mrfoxtalbot]

Twenty Twenty: heading nested inside cover width discrepancy. Public view

[mrfoxtalbot]

There is similar issue affecting Twenty Twenty-One here: #56049

[kajalgohel]

Added patch for solving the issue by removing max-width; inherit;

[harshvaishnav]

This issue was resolved by the patch given by @kajalgohel .

Theme: Twenty Twenty-One
WP version: 6.0

Please find attached screenshot:
​https://share.cleanshot.com/8JoxmNZbOXGOStzWUu1O

[audrasjb]

front end

[audrasjb]

Before patch

[audrasjb]

After patch: looks better!

[audrasjb]

This patch fixes the issue, but it doesn't update the related SASS file accordingly.
I'll update it directly in the final commit :)

[audrasjb]

Fixed by [54164].

For some reason, Trac didn't catch up the changeset.