[wp-trac] [WordPress Trac] #54254: Twenty Twenty One: Image block control button alignment issue while using inside column (was: Twenty Twenty One theme Image block button alignment issue while using inside column)

[WordPress Trac]

#54254: Twenty Twenty One: Image block control button alignment issue while using
inside column
---------------------------+----------------------
 Reporter:  multidots1896  |       Owner:  (none)
     Type:  defect (bug)   |      Status:  new
 Priority:  normal         |   Milestone:  5.9
Component:  Bundled Theme  |     Version:  5.8.1
 Severity:  normal         |  Resolution:
 Keywords:  has-patch      |     Focuses:  ui, css
---------------------------+----------------------
Changes (by sabernhardt):

 * focuses:  ui, css, coding-standards => ui, css
 * component:  General => Bundled Theme
 * milestone:  Awaiting Review => 5.9


Comment:

 Hi and thanks for the report and patches!

 The block editor specifies aligning those buttons left (or right in RTL
 languages):
 {{{
 .components-placeholder.components-placeholder {
     text-align: left;
 }
 }}}

 However, Twenty Twenty-One **tries** to center the image in the editor and
 also centers these buttons.
 {{{
 .wp-block-image > div {
         text-align: center;
 }
 }}}

 I did not expect `.wp-block-image > div:not(.components-placeholder)` to
 work with the patch on #53809, so [attachment:"54254.2.patch"] inherits
 the alignment.
 {{{
 .wp-block-image > .components-placeholder {
         text-align: inherit;
 }
 }}}

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