Fix image block centering when resizing to a smaller size (#26376)

* Fix image block centering when resizing to a smaller size * Revert previous 100% width fix * Remove display: table when image block is resized to avoid centering of block * Match frontend classes for alignment in editor
WordPress · Nov 11, 2020 · 316601e · 316601e
1 parent ba3b39d
commit 316601e
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/packages/block-library/src/image/editor.scss b/packages/block-library/src/image/editor.scss
@@ -52,6 +52,19 @@ figure.wp-block-image:not(.wp-block) {
 	}
 }
 
+.wp-block[data-align="left"],
+.wp-block[data-align="center"],
+.wp-block[data-align="right"] {
+	> .wp-block-image {
+		display: table;
+
+		> figcaption {
+			display: table-caption;
+			caption-side: bottom;
+		}
+	}
+}
+
 .wp-block[data-align="left"] > .wp-block-image {
 	margin-right: 1em;
 	margin-left: 0;

diff --git a/packages/block-library/src/image/style.scss b/packages/block-library/src/image/style.scss
@@ -18,8 +18,7 @@
 
 	.alignleft,
 	.alignright,
-	.aligncenter,
-	&.is-resized {
+	.aligncenter {
 		display: table;
 
 		> figcaption {