Make WordPress Core

Opened 7 weeks ago

Last modified 38 hours ago

#54056 reopened defect (bug)

Twenty Twenty: Editor title alignment broken by Gutenberg plugin v11.4.0 updates

Reported by: shireling Owned by:
Milestone: 5.8.2 Priority: normal
Severity: normal Version:
Component: Bundled Theme Keywords: has-patch
Focuses: Cc:


The in-editor styles for the post/page title no longer properly update the alignment or size of the post/page title after the implementation of the rich text hook for post titles in Gutenberg 11.4.0.

In the screenshot below, styling under Gutenberg 11.3.0 can be seen on the left, and 11.4.0 on the right:


It looks like editor styles are targeting
.editor-styles-wrapper .wp-block h1
instead of
.editor-styles-wrapper h1.wp-block
that Gutenberg is now outputting.

This change also introduces markup changes that break the current targeting the post title of
.editor-styles-wrapper .editor-post-title__block .editor-post-title__input
Under the new markup

Finally, the title block itself was previously wrapped in an additional div that is no longer present. This div was generating the margins that helped to center the title above the post content.

Attachments (1)

54056.patch (441 bytes) - added by hilayt24 3 weeks ago.
The Gutenberg style is overridden with the default theme styles of twenty nineteen.

Download all attachments as: .zip

Change History (7)

#1 @shireling
7 weeks ago

Update: It turns out the change that triggered this issue was actually the removal of the wrapper div.

Some of the fixes for this have been made directly in Gutenberg, but it looks like there may still be some theme-specific changes to be made if needed.

This ticket was mentioned in Slack in #core-test by mai21. View the logs.

4 weeks ago

#3 @mai21
4 weeks ago

  • Resolution set to invalid
  • Status changed from new to closed

Could reproduce it as follow:
1- Fresh install for WP version 5.8.1
2- Switch theme to Twenty Twenty
3- Open edit view of the sample page
4- On another fresh version of WP using 5.9-alpha-51857
5- Install on the latest WP the Gutenberg plugin (v 11.5.1)
6- Open edit of the same sample page

Actual: text styling is different


  • tested the same scenario on Twenty Nineteen => page edit was almost the same with very little shift (I think due to adding Author is page variables)
  • Tested on Twenty Twenty One and titles were different in style as well + the shift mentioned above

#4 @mai21
4 weeks ago

  • Resolution invalid deleted
  • Status changed from closed to reopened

opening it as it was closed by mistake

#5 @hellofromTonya
4 weeks ago

  • Keywords needs-patch added
  • Milestone changed from Awaiting Review to 5.8.2

Moving into 5.8.2 milestone.

3 weeks ago

The Gutenberg style is overridden with the default theme styles of twenty nineteen.

#6 @hilayt24
3 weeks ago

  • Keywords has-patch added; needs-patch removed
Note: See TracTickets for help on using tickets.