[wp-trac] [WordPress Trac] #54040: Changing element text or background color should only affect color

WordPress Trac noreply at wordpress.org
Tue Aug 31 11:40:02 UTC 2021


#54040: Changing element text or background color should only affect color
--------------------------+-----------------------------
 Reporter:  brylie        |      Owner:  (none)
     Type:  defect (bug)  |     Status:  new
 Priority:  normal        |  Milestone:  Awaiting Review
Component:  General       |    Version:  5.8
 Severity:  normal        |   Keywords:
  Focuses:  css           |
--------------------------+-----------------------------
 Page elements get unintended padding when changing background or font
 color, violating the
 [https://en.wikipedia.org/wiki/Principle_of_least_astonishment principle
 of least astonishment].

 In effect, the end-user is expecting that a change to the background color
 would have only one outcome. Instead, there is a second side-effect where
 the element gets padding.

 Padding is added to many elements via CSS selectors that mostly target
 ".has-background," such as the following.

 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/heading/style.css#L76-L78
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/heading/style-rtl.css#L76-L78
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/list/style.min.css#L1
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/list/style-rtl.min.css#L1
 -
 https://github.com/WordPress/WordPress/blob/270f2011f8ec7265c3f4ddce39c77ef5b496ed1c
 /wp-
 content/themes/twentytwentyone/assets/sass/05-blocks/group/_editor.scss#L18-L23
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/list/style-rtl.css#L72-L74
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/list/style.css#L72-L74
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/paragraph/style-rtl.css#L101-L103
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/paragraph/style.css#L101-L103
 -
 https://github.com/WordPress/WordPress/blob/270f2011f8ec7265c3f4ddce39c77ef5b496ed1c
 /wp-
 content/themes/twentytwentyone/assets/sass/05-blocks/rss/_editor.scss#L104-L107
 -
 https://github.com/WordPress/WordPress/blob/270f2011f8ec7265c3f4ddce39c77ef5b496ed1c
 /wp-
 content/themes/twentytwentyone/assets/sass/05-blocks/rss/_style.scss#L104-L107
 -
 https://github.com/WordPress/WordPress/blob/8a11188d0f5728bc9bbdf331ff9174d45b1768a6
 /wp-content/themes/twentytwentyone/assets/sass/03-generic/vertical-
 margins.scss#L159-L161
 -
 https://github.com/WordPress/WordPress/blob/270f2011f8ec7265c3f4ddce39c77ef5b496ed1c
 /wp-
 content/themes/twentytwentyone/assets/sass/05-blocks/paragraph/_editor.scss#L4-L6
 -
 https://github.com/WordPress/WordPress/blob/1a7033e75ff6b5911b2b9d34ceee38e80084b85e
 /wp-content/themes/twentytwentyone/assets/sass/05-blocks/query-
 loop/_style.scss#L3-L8
 -
 https://github.com/WordPress/WordPress/blob/1a7033e75ff6b5911b2b9d34ceee38e80084b85e
 /wp-content/themes/twentytwentyone/assets/sass/05-blocks/query-
 loop/_editor.scss#L3-L7
 -
 https://github.com/WordPress/WordPress/blob/270f2011f8ec7265c3f4ddce39c77ef5b496ed1c
 /wp-
 content/themes/twentytwentyone/assets/sass/05-blocks/paragraph/_style.scss#L6-L8
 -
 https://github.com/WordPress/WordPress/blob/0a2b52dfeb4e28e4ff3714899a2890a779c3748f
 /wp-content/themes/twentytwentyone/assets/sass/05-blocks/latest-
 posts/_style.scss#L112-L115
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/preformatted/style.css#L75-L77
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/preformatted/style-rtl.css#L75-L77
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/group/editor.css#L83-L86
 -
 https://github.com/WordPress/WordPress/blob/8df663cbfafedd6e594c3df8101e6085dfe18035
 /wp-includes/blocks/group/editor-rtl.css#L83-L86
 -
 https://github.com/WordPress/WordPress/blob/c3ea09ebb8034be04f42e5aaf5f523cbead7e2a4
 /wp-includes/blocks/columns/style.css#L85-L87
 -
 https://github.com/WordPress/WordPress/blob/c3ea09ebb8034be04f42e5aaf5f523cbead7e2a4
 /wp-includes/blocks/columns/style-rtl.css#L85-L87
 -
 https://github.com/WordPress/WordPress/blob/0638de4c60de0d9cf800ca887177b67ba8ad68f0
 /wp-content/themes/twentynineteen/style-editor.scss#L868-L880
 -
 https://github.com/WordPress/WordPress/blob/270f2011f8ec7265c3f4ddce39c77ef5b496ed1c
 /wp-content/themes/twentyseventeen/assets/css/editor-blocks.css#L496-L498

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/54040>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform


More information about the wp-trac mailing list