Make WordPress Core

Opened 16 months ago

Last modified 2 months ago

#58099 new defect (bug)

Twenty Nineteen: Button block does not respect custom width in the editor

Reported by: nidhidhandhukiya's profile nidhidhandhukiya Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version: 5.7
Component: Bundled Theme Keywords: needs-patch
Focuses: css Cc:


Steps to reproduce the issue :-

  1. Activate Twenty Nineteen theme.
  2. Choose button block.
  3. Apply width from 25, 50 or 75.

You can able to see a different changes user side but editor side it remains same.

I have attached video for better understanding.
Video URL :-

Change History (4)

#1 @nidhidhandhukiya
16 months ago

The reason behind this issue is the css below.

.editor-styles-wrapper .wp-block .wp-block {
    width: initial;

If we remove this the issue is resolved.
(Note:- I don't know for which actual problem solution this css is written so if we remove this it will affect other block)

#2 @sabernhardt
16 months ago

  • Focuses css added
  • Keywords needs-patch added
  • Milestone changed from Awaiting Review to Future Release
  • Summary changed from Twenty nineteen button having issue in editor side when width is used. to Twenty Nineteen: Button block does not respect custom width in the editor

The width was added mainly for blocks inside Column blocks (and/or Group blocks, etc.) in PR 454 and PR 526. Then [47587] changed the value from 100% to initial.

The SCSS file probably could use .wp-block:where(:not(.has-custom-width)), which would compile to .editor-styles-wrapper .wp-block .wp-block:where(:not(.has-custom-width)).

#3 @sabernhardt
16 months ago

  • Version changed from 6.2 to 5.7

The button width settings have been available since 5.7.

#4 @sabernhardt
2 months ago

#60885 was marked as a duplicate.

Note: See TracTickets for help on using tickets.