[wp-trac] [WordPress Trac] #60196: Twenty Twenty-One: List Item blocks have extra margin in editor

Thu Jun 5 21:25:57 UTC 2025

#60196: Twenty Twenty-One: List Item blocks have extra margin in editor
------------------------------+---------------------
 Reporter:  nidhidhandhukiya  |       Owner:  (none)
     Type:  defect (bug)      |      Status:  new
 Priority:  normal            |   Milestone:  6.9
Component:  Bundled Theme     |     Version:  6.1
 Severity:  minor             |  Resolution:
 Keywords:  has-patch         |     Focuses:  css
------------------------------+---------------------
Changes (by sabernhardt):

 * keywords:  has-patch changes-requested => has-patch

Comment:

 > From testing on Playground, it seems that the margins are still
 different. Now there is a bit more spacing in the frontend than in the
 editor.

 The spacing is still different because the [https://github.com/WordPress
 /wordpress-develop/blob/5be596a57ce4292f4d0506f3c1740ba4b5d69781/src/wp-
 content/themes/twentytwentyone/assets/sass/06-components/editor.scss#L3
 editor styles] sets the `line-height` on `html` and the
 [https://github.com/WordPress/WordPress/blob/03720cec5c8a90e99a26f8e9ebf3b35d6ebda546
 /wp-includes/css/dist/block-library/reset.css#L6 reset styles] assign a
 `line-height` of `normal` on the iframe `<body>`—or a container `<div>` in
 the widget editor—using `html :where(.editor-styles-wrapper)`.

 I think the theme could set the `line-height` on both `html` and `body` in
 its editor stylesheets, but that discussion probably belongs on a separate
 ticket.

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