[wp-trac] [WordPress Trac] #49843: Twenty Nineteen: Fix editor style compatibility with Gutenberg 7.7 and above

[WordPress Trac]

#49843: Twenty Nineteen: Fix editor style compatibility with Gutenberg 7.7 and
above
---------------------------+---------------------
 Reporter:  kjellr         |       Owner:  (none)
     Type:  defect (bug)   |      Status:  new
 Priority:  normal         |   Milestone:  5.5
Component:  Bundled Theme  |     Version:  trunk
 Severity:  normal         |  Resolution:
 Keywords:  needs-testing  |     Focuses:
---------------------------+---------------------

Comment (by Joen):

 Really nice work, Kjell! This makes it vastly improved, and my go-to theme
 will become my go-to theme again! Wohoo!

 The good things:

 - Fullwide works
 - Wide works
 - The slightly-offset-to-the-left works

 The floats aren't working well, though, and I think it's a regression of a
 previous fix that brought us this rule:

 {{{
 .editor-styles-wrapper .wp-block .wp-block {
     width: 100%;
 }
 }}}

 Those rules for whatever reason are applied to floated blocks, meaning
 they always look non-floated:

 https://core.trac.wordpress.org/attachment/ticket/49843/Screenshot%202020-04-08%20at%2008.29.00.png

 If I apply width: auto to the float wp-block class, then it looks correct:

 https://core.trac.wordpress.org/attachment/ticket/49843/Screenshot%202020-04-08%20at%2008.28.49.png

 But I wonder, is there a different way to fix this? I believe the reason
 for the original rule was that top-level blocks have this calc-based
 width, but child blocks should not have that. So I can think of two other
 ways to go about this:

 1.

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

 I can't recall the IE rules here, but maybe this would work?

 2.

 {{{
 .is-root-container > .wp-block .wp-block {
     width: 100%;
 }
 }}}

 the 2nd seems perfect, as that root container class is new in the plugin.
 But it won't work in older versions. We would also need to test the 2nd
 rule carefully with reusable blocks, as I believe they also add the "is-
 root-container", even though probably they shouldn't.

 Thanks Kjell!

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/49843#comment:1>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform