Changes between Version 4 and Version 5 of Ticket #55839, comment 2
- Timestamp:
- 06/06/2022 07:10:09 AM (3 years ago)
Legend:
- Unmodified
- Added
- Removed
- Modified
-
Ticket #55839, comment 2
v4 v5 1 1 I have the same issue using Astra 3.8.2, not resolved by using Twenty-Twenty-Two theme (isn't theme issue). Affects pre-existing post images and newly inserted images equally (center-align in editor displays as left-aligned in post). Development environment (Laragon WAMP), flush browser cache, restart Apache etc. doesn't change. Windows 10, Chrome 102.0.5005.63, Firefox 101.0 (64bit). 2 2 3 The image (<img>) is a child (<figure>) of figure which has classes .wp-block-image and .aligncenter.3 The image (<img>) is a child (<figure>) of figure which has classes **.wp-block-image** and **.aligncenter**. 4 4 5 Class .wp-block-center in css/dist/block-library/style.min.cssv6.0.1 has "margin: 0 0 1em;"5 Class **.wp-block-center** in css/dist/block-library/**style.min.css** v6.0.1 has "margin: 0 0 1em;" 6 6 7 7 Clearing (unticking) this style rule in Chrome Developer Tools resolves the problem: center-aligned images snap to center as expected (and are no longer left aligned). 8 8 9 Using Chrome Dev Tools to follow the computed CSS reveals the above class (with 0px horizontal margin) overrides class .aligncenter class in Astra's assets/css/minified/frontend.min.css(with margin-left: auto;)9 Using Chrome Dev Tools to follow the computed CSS reveals the above class (with 0px horizontal margin) overrides class **.aligncenter** class in Astra's assets/css/minified/**frontend.min.css** (with margin-left: auto;) 10 10 11 11 Adding CSS below to the child-theme CSS corrects the behaviour: 12 12 13 13 {{{ 14 figure.wp-block-image.aligncenter 14 figure.wp-block-image.aligncenter { 15 15 margin-left: auto; 16 16 margin-right: auto; … … 19 19 20 20 21 I hope this helps towards resolving the problem things.21 I hope this helps towards resolving the issue.