diff --git a/packages/block-library/src/media-text/edit.js b/packages/block-library/src/media-text/edit.js
index 8ea6752c62663..f41b0309d0024 100644
--- a/packages/block-library/src/media-text/edit.js
+++ b/packages/block-library/src/media-text/edit.js
@@ -168,7 +168,7 @@ function MediaTextEdit( { attributes, isSelected, setAttributes } ) {
 	const imperativeFocalPointPreview = ( value ) => {
 		const { style } = refMediaContainer.current.resizable;
 		const { x, y } = value;
-		style.backgroundPosition = `${ x * 100 }% ${ y * 100 }%`;
+		style.objectPosition = `${ x * 100 }% ${ y * 100 }%`;
 	};
 
 	const [ temporaryMediaWidth, setTemporaryMediaWidth ] = useState( null );
@@ -252,7 +252,7 @@ function MediaTextEdit( { attributes, isSelected, setAttributes } ) {
 					}
 				/>
 			) }
-			{ imageFill && mediaUrl && mediaType === 'image' && (
+			{ imageFill && mediaUrl && (
 				<FocalPointPicker
 					__nextHasNoMarginBottom
 					__next40pxDefaultSize
diff --git a/packages/block-library/src/media-text/media-container.js b/packages/block-library/src/media-text/media-container.js
index 951c0013b76eb..651b1a9614d17 100644
--- a/packages/block-library/src/media-text/media-container.js
+++ b/packages/block-library/src/media-text/media-container.js
@@ -21,6 +21,7 @@ import { forwardRef } from '@wordpress/element';
 import { isBlobURL } from '@wordpress/blob';
 import { store as noticesStore } from '@wordpress/notices';
 import { media as icon } from '@wordpress/icons';
+export const DEFAULT_FOCAL_POINT = { x: 0.5, y: 0.5 };
 
 /**
  * Constants
@@ -28,17 +29,18 @@ import { media as icon } from '@wordpress/icons';
 const ALLOWED_MEDIA_TYPES = [ 'image', 'video' ];
 const noop = () => {};
 
-export function imageFillStyles( url, focalPoint ) {
-	return url
-		? {
-				backgroundImage: `url(${ url })`,
-				backgroundPosition: focalPoint
-					? `${ Math.round( focalPoint.x * 100 ) }% ${ Math.round(
-							focalPoint.y * 100
-					  ) }%`
-					: `50% 50%`,
-		  }
-		: {};
+export function imageFillStyles( focalPoint ) {
+	return {
+		objectPosition: focalPoint
+			? `${ Math.round( focalPoint.x * 100 ) }% ${ Math.round(
+					focalPoint.y * 100
+			  ) }%`
+			: `50% 50%`,
+	};
+}
+
+export function focalPosition( { x, y } = DEFAULT_FOCAL_POINT ) {
+	return `${ Math.round( x * 100 ) }% ${ Math.round( y * 100 ) }%`;
 }
 
 const ResizableBoxContainer = forwardRef(
@@ -132,14 +134,15 @@ function MediaContainer( props, ref ) {
 			left: enableResize && mediaPosition === 'right',
 		};
 
-		const backgroundStyles =
-			mediaType === 'image' && imageFill
-				? imageFillStyles( mediaUrl, focalPoint )
-				: {};
+		const mediaStyles = imageFill ? imageFillStyles( focalPoint ) : {};
 
 		const mediaTypeRenderers = {
-			image: () => <img src={ mediaUrl } alt={ mediaAlt } />,
-			video: () => <video controls src={ mediaUrl } />,
+			image: () => (
+				<img src={ mediaUrl } alt={ mediaAlt } style={ mediaStyles } />
+			),
+			video: () => (
+				<video controls src={ mediaUrl } style={ mediaStyles } />
+			),
 		};
 
 		return (
@@ -150,7 +153,6 @@ function MediaContainer( props, ref ) {
 					'editor-media-container__resizer',
 					{ 'is-transient': isTemporaryMedia }
 				) }
-				style={ backgroundStyles }
 				size={ { width: mediaWidth + '%' } }
 				minWidth="10%"
 				maxWidth="100%"
diff --git a/packages/block-library/src/media-text/save.js b/packages/block-library/src/media-text/save.js
index 0a2b1ab3d3946..81c149491d070 100644
--- a/packages/block-library/src/media-text/save.js
+++ b/packages/block-library/src/media-text/save.js
@@ -11,7 +11,7 @@ import { useInnerBlocksProps, useBlockProps } from '@wordpress/block-editor';
 /**
  * Internal dependencies
  */
-import { imageFillStyles } from './media-container';
+import { focalPosition } from './media-container';
 import { DEFAULT_MEDIA_SIZE_SLUG } from './constants';
 
 const DEFAULT_MEDIA_WIDTH = 50;
@@ -42,10 +42,17 @@ export default function save( { attributes } ) {
 		[ `size-${ mediaSizeSlug }` ]: mediaId && mediaType === 'image',
 	} );
 
+	const objectPosition =
+		// prettier-ignore
+		focalPoint
+			? focalPosition(focalPoint)
+			: undefined;
+
 	let image = (
 		<img
 			src={ mediaUrl }
 			alt={ mediaAlt }
+			style={ { objectPosition } }
 			className={ imageClasses || null }
 		/>
 	);
@@ -56,6 +63,7 @@ export default function save( { attributes } ) {
 				className={ linkClass }
 				href={ href }
 				target={ linkTarget }
+				style={ { objectPosition } }
 				rel={ newRel }
 			>
 				{ image }
@@ -65,7 +73,9 @@ export default function save( { attributes } ) {
 
 	const mediaTypeRenders = {
 		image: () => image,
-		video: () => <video controls src={ mediaUrl } />,
+		video: () => (
+			<video controls src={ mediaUrl } style={ { objectPosition } } />
+		),
 	};
 	const className = classnames( {
 		'has-media-on-the-right': 'right' === mediaPosition,
@@ -73,9 +83,6 @@ export default function save( { attributes } ) {
 		[ `is-vertically-aligned-${ verticalAlignment }` ]: verticalAlignment,
 		'is-image-fill': imageFill,
 	} );
-	const backgroundStyles = imageFill
-		? imageFillStyles( mediaUrl, focalPoint )
-		: {};
 
 	let gridTemplateColumns;
 	if ( mediaWidth !== DEFAULT_MEDIA_WIDTH ) {
@@ -96,10 +103,7 @@ export default function save( { attributes } ) {
 						className: 'wp-block-media-text__content',
 					} ) }
 				/>
-				<figure
-					className="wp-block-media-text__media"
-					style={ backgroundStyles }
-				>
+				<figure className="wp-block-media-text__media">
 					{ ( mediaTypeRenders[ mediaType ] || noop )() }
 				</figure>
 			</div>
@@ -107,10 +111,7 @@ export default function save( { attributes } ) {
 	}
 	return (
 		<div { ...useBlockProps.save( { className, style } ) }>
-			<figure
-				className="wp-block-media-text__media"
-				style={ backgroundStyles }
-			>
+			<figure className="wp-block-media-text__media">
 				{ ( mediaTypeRenders[ mediaType ] || noop )() }
 			</figure>
 			<div
diff --git a/packages/block-library/src/media-text/style.scss b/packages/block-library/src/media-text/style.scss
index e43961ac89097..8b206fe0236db 100644
--- a/packages/block-library/src/media-text/style.scss
+++ b/packages/block-library/src/media-text/style.scss
@@ -41,6 +41,7 @@
 	grid-row: 1;
 	/*!rtl:end:ignore*/
 	margin: 0;
+	position: relative;
 }
 
 .wp-block-media-text .wp-block-media-text__content {
@@ -86,16 +87,23 @@
 	height: 100%;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media img {
-	// The image is visually hidden but accessible to assistive technologies.
-	position: absolute;
-	width: 1px;
-	height: 1px;
+.wp-block-media-text.is-image-fill .wp-block-media-text__media img,
+.wp-block-media-text.is-image-fill .wp-block-media-text__media video {
+	border: none;
+	bottom: 0;
+	box-shadow: none;
+	height: 100%;
+	left: 0;
+	margin: 0;
+	max-height: none;
+	max-width: none;
+	object-fit: cover;
+	outline: none;
 	padding: 0;
-	margin: -1px;
-	overflow: hidden;
-	clip: rect(0, 0, 0, 0);
-	border: 0;
+	position: absolute;
+	right: 0;
+	top: 0;
+	width: 100%;
 }
 /*
 * Here we here not able to use a mobile first CSS approach.
diff --git a/packages/block-library/src/media-text/test/media-container.js b/packages/block-library/src/media-text/test/media-container.js
index 582ec2be8d5ad..322eeded0534b 100644
--- a/packages/block-library/src/media-text/test/media-container.js
+++ b/packages/block-library/src/media-text/test/media-container.js
@@ -4,21 +4,16 @@
 import { imageFillStyles } from '../media-container';
 
 describe( 'imageFillStyles()', () => {
-	it( 'should return image url', () => {
-		const { backgroundImage } = imageFillStyles( 'image.jpg' );
-		expect( backgroundImage ).toBe( 'url(image.jpg)' );
+	it( 'should return centered object position', () => {
+		const { objectPosition } = imageFillStyles( { x: 0.5, y: 0.5 } );
+		expect( objectPosition ).toBe( '50% 50%' );
 	} );
 
-	it( 'should return centered background position', () => {
-		const { backgroundPosition } = imageFillStyles( 'image.jpg' );
-		expect( backgroundPosition ).toBe( '50% 50%' );
-	} );
-
-	it( 'should return custom background position', () => {
-		const { backgroundPosition } = imageFillStyles( 'image.jpg', {
+	it( 'should return custom object position', () => {
+		const { objectPosition } = imageFillStyles( {
 			x: 0.56,
 			y: 0.57,
 		} );
-		expect( backgroundPosition ).toBe( '56% 57%' );
+		expect( objectPosition ).toBe( '56% 57%' );
 	} );
 } );
diff --git a/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.html b/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.html
index 22a2a3e18f74f..05514e573bb6c 100644
--- a/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.html
+++ b/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.html
@@ -1,7 +1,6 @@
 <!-- wp:media-text {"mediaType":"image","imageFill":true} -->
 <div class="wp-block-media-text alignwide is-image-fill is-stacked-on-mobile">
-	<figure class="wp-block-media-text__media"
-		style="background-image:url(data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=);background-position:50% 50%">
+	<figure class="wp-block-media-text__media">
 		<img src="data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k="
 			alt="My alt text" /></figure>
 	<div class="wp-block-media-text__content">
diff --git a/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.json b/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.json
index bf195f6fa1c95..58fd287ef7897 100644
--- a/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.json
+++ b/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.json
@@ -3,14 +3,15 @@
 		"name": "core/media-text",
 		"isValid": true,
 		"attributes": {
-			"align": "wide",
+			"align": "none",
 			"mediaAlt": "My alt text",
 			"mediaPosition": "left",
+			"mediaUrl": "data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=",
 			"mediaType": "image",
 			"mediaWidth": 50,
 			"isStackedOnMobile": true,
-			"mediaUrl": "data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=",
-			"imageFill": true
+			"imageFill": true,
+			"className": "alignwide"
 		},
 		"innerBlocks": [
 			{
diff --git a/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.parsed.json b/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.parsed.json
index 2e878c98a18a8..73a043b620ea0 100644
--- a/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.parsed.json
+++ b/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.parsed.json
@@ -13,17 +13,17 @@
 					"fontSize": "large"
 				},
 				"innerBlocks": [],
-				"innerHTML": "\n\t\t<p class=\"has-large-font-size\">My Content</p>\n\t\t",
+				"innerHTML": "\r\n\t\t<p class=\"has-large-font-size\">My Content</p>\r\n\t\t",
 				"innerContent": [
-					"\n\t\t<p class=\"has-large-font-size\">My Content</p>\n\t\t"
+					"\r\n\t\t<p class=\"has-large-font-size\">My Content</p>\r\n\t\t"
 				]
 			}
 		],
-		"innerHTML": "\n<div class=\"wp-block-media-text alignwide is-image-fill is-stacked-on-mobile\">\n\t<figure class=\"wp-block-media-text__media\"\n\t\tstyle=\"background-image:url(data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=);background-position:50% 50%\">\n\t\t<img src=\"data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=\"\n\t\t\talt=\"My alt text\" /></figure>\n\t<div class=\"wp-block-media-text__content\">\n\t\t\n\t</div>\n</div>\n",
+		"innerHTML": "\r\n<div class=\"wp-block-media-text alignwide is-image-fill is-stacked-on-mobile\">\r\n\t<figure class=\"wp-block-media-text__media\">\r\n\t\t<img src=\"data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=\"\r\n\t\t\talt=\"My alt text\" /></figure>\r\n\t<div class=\"wp-block-media-text__content\">\r\n\t\t\r\n\t</div>\r\n</div>\r\n",
 		"innerContent": [
-			"\n<div class=\"wp-block-media-text alignwide is-image-fill is-stacked-on-mobile\">\n\t<figure class=\"wp-block-media-text__media\"\n\t\tstyle=\"background-image:url(data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=);background-position:50% 50%\">\n\t\t<img src=\"data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=\"\n\t\t\talt=\"My alt text\" /></figure>\n\t<div class=\"wp-block-media-text__content\">\n\t\t",
+			"\r\n<div class=\"wp-block-media-text alignwide is-image-fill is-stacked-on-mobile\">\r\n\t<figure class=\"wp-block-media-text__media\">\r\n\t\t<img src=\"data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=\"\r\n\t\t\talt=\"My alt text\" /></figure>\r\n\t<div class=\"wp-block-media-text__content\">\r\n\t\t",
 			null,
-			"\n\t</div>\n</div>\n"
+			"\r\n\t</div>\r\n</div>\r\n"
 		]
 	}
 ]
diff --git a/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.serialized.html b/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.serialized.html
index 40382e884f618..ef5b80c8dc379 100644
--- a/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.serialized.html
+++ b/test/integration/fixtures/blocks/core__media-text__image-fill-no-focal-point-selected.serialized.html
@@ -1,5 +1,5 @@
-<!-- wp:media-text {"align":"wide","mediaType":"image","imageFill":true} -->
-<div class="wp-block-media-text alignwide is-stacked-on-mobile is-image-fill"><figure class="wp-block-media-text__media" style="background-image:url(data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=);background-position:50% 50%"><img src="data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=" alt="My alt text"/></figure><div class="wp-block-media-text__content"><!-- wp:paragraph {"placeholder":"Content…","fontSize":"large"} -->
+<!-- wp:media-text {"mediaType":"image","imageFill":true,"className":"alignwide"} -->
+<div class="wp-block-media-text is-stacked-on-mobile is-image-fill alignwide"><figure class="wp-block-media-text__media"><img src="data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=" alt="My alt text"/></figure><div class="wp-block-media-text__content"><!-- wp:paragraph {"placeholder":"Content…","fontSize":"large"} -->
 <p class="has-large-font-size">My Content</p>
 <!-- /wp:paragraph --></div></div>
 <!-- /wp:media-text -->
diff --git a/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.html b/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.html
index 47a0f0c126fa7..27c60807b37a2 100644
--- a/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.html
+++ b/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.html
@@ -1,9 +1,8 @@
 <!-- wp:media-text {"mediaType":"image","imageFill":true,"focalPoint":{"x":0.84,"y":0.84}} -->
 <div class="wp-block-media-text alignwide is-image-fill is-stacked-on-mobile">
-	<figure class="wp-block-media-text__media"
-		style="background-image:url(data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=);background-position:84% 84%">
+	<figure class="wp-block-media-text__media">
 		<img src="data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k="
-			alt="My alt text" /></figure>
+			alt="My alt text" style="object-position:84% 84%;"/></figure>
 	<div class="wp-block-media-text__content">
 		<!-- wp:paragraph {"placeholder":"Content…","fontSize":"large"} -->
 		<p class="has-large-font-size">My Content</p>
diff --git a/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.json b/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.json
index 986e049099541..d12d36699b013 100644
--- a/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.json
+++ b/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.json
@@ -3,18 +3,19 @@
 		"name": "core/media-text",
 		"isValid": true,
 		"attributes": {
-			"align": "wide",
+			"align": "none",
 			"mediaAlt": "My alt text",
 			"mediaPosition": "left",
+			"mediaUrl": "data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=",
 			"mediaType": "image",
 			"mediaWidth": 50,
 			"isStackedOnMobile": true,
-			"mediaUrl": "data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=",
 			"imageFill": true,
 			"focalPoint": {
 				"x": 0.84,
 				"y": 0.84
-			}
+			},
+			"className": "alignwide"
 		},
 		"innerBlocks": [
 			{
diff --git a/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.parsed.json b/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.parsed.json
index 175fbad27927b..31ffe78bf2e9b 100644
--- a/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.parsed.json
+++ b/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.parsed.json
@@ -17,17 +17,17 @@
 					"fontSize": "large"
 				},
 				"innerBlocks": [],
-				"innerHTML": "\n\t\t<p class=\"has-large-font-size\">My Content</p>\n\t\t",
+				"innerHTML": "\r\n\t\t<p class=\"has-large-font-size\">My Content</p>\r\n\t\t",
 				"innerContent": [
-					"\n\t\t<p class=\"has-large-font-size\">My Content</p>\n\t\t"
+					"\r\n\t\t<p class=\"has-large-font-size\">My Content</p>\r\n\t\t"
 				]
 			}
 		],
-		"innerHTML": "\n<div class=\"wp-block-media-text alignwide is-image-fill is-stacked-on-mobile\">\n\t<figure class=\"wp-block-media-text__media\"\n\t\tstyle=\"background-image:url(data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=);background-position:84% 84%\">\n\t\t<img src=\"data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=\"\n\t\t\talt=\"My alt text\" /></figure>\n\t<div class=\"wp-block-media-text__content\">\n\t\t\n\t</div>\n</div>\n",
+		"innerHTML": "\r\n<div class=\"wp-block-media-text alignwide is-image-fill is-stacked-on-mobile\">\r\n\t<figure class=\"wp-block-media-text__media\">\r\n\t\t<img src=\"data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=\"\r\n\t\t\talt=\"My alt text\" style=\"object-position:84% 84%;\"/></figure>\r\n\t<div class=\"wp-block-media-text__content\">\r\n\t\t\r\n\t</div>\r\n</div>\r\n",
 		"innerContent": [
-			"\n<div class=\"wp-block-media-text alignwide is-image-fill is-stacked-on-mobile\">\n\t<figure class=\"wp-block-media-text__media\"\n\t\tstyle=\"background-image:url(data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=);background-position:84% 84%\">\n\t\t<img src=\"data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=\"\n\t\t\talt=\"My alt text\" /></figure>\n\t<div class=\"wp-block-media-text__content\">\n\t\t",
+			"\r\n<div class=\"wp-block-media-text alignwide is-image-fill is-stacked-on-mobile\">\r\n\t<figure class=\"wp-block-media-text__media\">\r\n\t\t<img src=\"data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=\"\r\n\t\t\talt=\"My alt text\" style=\"object-position:84% 84%;\"/></figure>\r\n\t<div class=\"wp-block-media-text__content\">\r\n\t\t",
 			null,
-			"\n\t</div>\n</div>\n"
+			"\r\n\t</div>\r\n</div>\r\n"
 		]
 	}
 ]
diff --git a/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.serialized.html b/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.serialized.html
index 9445d0ad259b2..a5a1a73b64552 100644
--- a/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.serialized.html
+++ b/test/integration/fixtures/blocks/core__media-text__image-fill-with-focal-point-selected.serialized.html
@@ -1,5 +1,5 @@
-<!-- wp:media-text {"align":"wide","mediaType":"image","imageFill":true,"focalPoint":{"x":0.84,"y":0.84}} -->
-<div class="wp-block-media-text alignwide is-stacked-on-mobile is-image-fill"><figure class="wp-block-media-text__media" style="background-image:url(data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=);background-position:84% 84%"><img src="data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=" alt="My alt text"/></figure><div class="wp-block-media-text__content"><!-- wp:paragraph {"placeholder":"Content…","fontSize":"large"} -->
+<!-- wp:media-text {"mediaType":"image","imageFill":true,"focalPoint":{"x":0.84,"y":0.84},"className":"alignwide"} -->
+<div class="wp-block-media-text is-stacked-on-mobile is-image-fill alignwide"><figure class="wp-block-media-text__media"><img src="data:image/jpeg;base64,/9j/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/yQALCAABAAEBAREA/8wABgAQEAX/2gAIAQEAAD8A0s8g/9k=" alt="My alt text" style="object-position:84% 84%"/></figure><div class="wp-block-media-text__content"><!-- wp:paragraph {"placeholder":"Content…","fontSize":"large"} -->
 <p class="has-large-font-size">My Content</p>
 <!-- /wp:paragraph --></div></div>
 <!-- /wp:media-text -->