diff --git a/packages/block-library/src/image/editor.scss b/packages/block-library/src/image/editor.scss
index 0fd26a8e0bdecf..541791bd5748b9 100644
--- a/packages/block-library/src/image/editor.scss
+++ b/packages/block-library/src/image/editor.scss
@@ -70,6 +70,24 @@ figure.wp-block-image:not(.wp-block) {
 	}
 }
 
+*:not([data-align]) {
+	> .wp-block-image {
+		display: grid;
+		grid-template-columns: [image] minmax(0, max-content) [placeholder] auto;
+		.components-placeholder {
+			grid-column: placeholder;
+		}
+		> div:not(.components-placeholder) {
+			grid-column: image;
+		}
+		> figcaption {
+			grid-column: image;
+			display: table-caption;
+			caption-side: bottom;
+		}
+	}
+}
+
 .wp-block[data-align="left"] > .wp-block-image {
 	margin-right: 1em;
 	margin-left: 0;
diff --git a/packages/e2e-tests/specs/editor/blocks/cover.test.js b/packages/e2e-tests/specs/editor/blocks/cover.test.js
index e00bfb8ac51314..01b1971be1dcbf 100644
--- a/packages/e2e-tests/specs/editor/blocks/cover.test.js
+++ b/packages/e2e-tests/specs/editor/blocks/cover.test.js
@@ -197,6 +197,9 @@ describe( 'Cover', () => {
 		await insertBlock( 'Image' );
 		// Upload image and transform to the Cover block
 		await upload( '.wp-block-image' );
+		// Click the block wrapper before trying to convert to make sure figcaption toolbar is not obscuring
+		// the block toolbar.
+		await page.click( '.wp-block-image' );
 		await transformBlockTo( 'Cover' );
 
 		// Get the block's background dim color and its opacity
diff --git a/packages/e2e-tests/specs/editor/blocks/image.test.js b/packages/e2e-tests/specs/editor/blocks/image.test.js
index 815ad881551bc1..291bb125f4226b 100644
--- a/packages/e2e-tests/specs/editor/blocks/image.test.js
+++ b/packages/e2e-tests/specs/editor/blocks/image.test.js
@@ -103,8 +103,9 @@ describe( 'Image', () => {
 			`<!-- wp:image {"id":\\d+,"sizeSlug":"full","linkDestination":"none"} -->\\s*<figure class="wp-block-image size-full"><img src="[^"]+\\/${ filename2 }\\.png" alt="" class="wp-image-\\d+"/></figure>\\s*<!-- \\/wp:image -->`
 		);
 		expect( await getEditedPostContent() ).toMatch( regex3 );
-
-		await page.click( '.wp-block-image' );
+		// For some reason just clicking the block wrapper causes figcaption to get focus
+		// in puppeteer but not in live browser, so clicking on the image wrapper div here instead.
+		await page.click( '.wp-block-image > div' );
 		await page.keyboard.press( 'Backspace' );
 
 		expect( await getEditedPostContent() ).toBe( '' );