Make WordPress Core

Opened 19 months ago

Closed 19 months ago

Last modified 19 months ago

#55703 closed defect (bug) (reported-upstream)

Columns block has layout issue with WordPress 6.0 RC

Reported by: marctison75's profile marctison75 Owned by:
Milestone: Priority: normal
Severity: normal Version: 6.0
Component: Editor Keywords:
Focuses: css Cc:


I've tested multiple sites that I managed with WordPress 6.0 RC, and I see that it changes and breaks the layout of the columns block on the front-end.

The gutter between the columns is now very small.

The columns are now stacked on tablet while the setting says "Stack on mobile". With WP 5.9, the columns are 50% 50% on tablet (iPad portrait 768px). With WP 6.0 they are 100% which breaks the design of my websites.

You can reproduce this issue with the Twenty Twenty-One or the Twenty Twenty theme, Kadence, and Blocksy.

With Twenty Twenty-Two, the gutter stays the same, but there is the same issue with the columns stacking on tablet.

Change History (7)

#1 @nidhidhandhukiya
19 months ago

Hello @marctison75,
I also able to face this issue.
This is happen because if you check in 5.9 there is a space related css
CSS :-
@media (min-width: 782px) {

child){margin-left: var(--wp--style--block-gap,2em);


This css is missing in our latest update that's why this gutter spacing is looking different between both columns.
If we need to make it same so adding this css can solve this issue.

Version 1, edited 19 months ago by nidhidhandhukiya (previous) (next) (diff)

#2 @sabernhardt
19 months ago

  • Component changed from General to Editor

#3 @hellofromTonya
19 months ago

  • Milestone changed from Awaiting Review to 6.0

Moving into the milestone for visibility.

This ticket was mentioned in Slack in #core by chaion07. View the logs.

19 months ago

#5 @chaion07
19 months ago

Hello @marctison75 and thank you for reporting this. We reviewed this ticket during a recent bug-scrub session. Based on the feedback received we feel the need to create another ticket on on the upstream Gutenberg repository. We hope this will result in more visibility and more people can look into it for a possible solution. @peterwilsoncc has volunteered to create the ticket and currently looking to issues labelled for the column blocks.

Props to @peterwilsoncc


#6 @costdev
19 months ago

  • Milestone 6.0 deleted
  • Resolution set to reported-upstream
  • Status changed from new to closed

This will need to be addressed in the Gutenberg repository and backported.

The upstream issue can be found here: GB 40952.

This ticket was mentioned in Slack in #core-editor by marctison75. View the logs.

19 months ago

Note: See TracTickets for help on using tickets.