diff --git a/lib/block-supports/layout.php b/lib/block-supports/layout.php
index 93c530f5814ff..55b25f478f65c 100644
--- a/lib/block-supports/layout.php
+++ b/lib/block-supports/layout.php
@@ -55,20 +55,20 @@ function gutenberg_get_layout_style( $selector, $layout, $has_block_gap_support
 		if ( $content_size || $wide_size ) {
 			$style  = "$selector > :not(.alignleft):not(.alignright) {";
 			$style .= 'max-width: ' . esc_html( $all_max_width_value ) . ';';
-			$style .= 'margin-left: auto !important;';
-			$style .= 'margin-right: auto !important;';
+			$style .= 'margin-inline-start: auto !important;';
+			$style .= 'margin-inline-end: auto !important;';
 			$style .= '}';
 
 			$style .= "$selector > .alignwide { max-width: " . esc_html( $wide_max_width_value ) . ';}';
 			$style .= "$selector .alignfull { max-width: none; }";
 		}
 
-		$style .= "$selector .alignleft { float: left; margin-right: 2em; margin-left: 0; }";
-		$style .= "$selector .alignright { float: right; margin-left: 2em; margin-right: 0; }";
+		$style .= "$selector .alignleft { float: left; margin-inline-start: 2em; margin-inline-end: 0; }";
+		$style .= "$selector .alignright { float: right; margin-inline-start: 2em; margin-inline-end: 0; }";
 		if ( $has_block_gap_support ) {
 			$gap_style = $gap_value ? $gap_value : 'var( --wp--style--block-gap )';
-			$style    .= "$selector > * { margin-top: 0; margin-bottom: 0; }";
-			$style    .= "$selector > * + * { margin-top: $gap_style;  margin-bottom: 0; }";
+			$style    .= "$selector > * { margin-block-start: 0; margin-block-end: 0; }";
+			$style    .= "$selector > * + * { margin-block-start: $gap_style; margin-block-end: 0; }";
 		}
 	} elseif ( 'flex' === $layout_type ) {
 		$layout_orientation = isset( $layout['orientation'] ) ? $layout['orientation'] : 'horizontal';
diff --git a/packages/block-editor/src/layouts/flow.js b/packages/block-editor/src/layouts/flow.js
index f5581534fa799..b0a1217cbd440 100644
--- a/packages/block-editor/src/layouts/flow.js
+++ b/packages/block-editor/src/layouts/flow.js
@@ -117,8 +117,8 @@ export default {
 				? `
 					${ appendSelectors( selector, '> :not(.alignleft):not(.alignright)' ) } {
 						max-width: ${ contentSize ?? wideSize };
-						margin-left: auto !important;
-						margin-right: auto !important;
+						margin-inline-start: auto !important;
+						margin-inline-end: auto !important;
 					}
 
 					${ appendSelectors( selector, '> .alignwide' ) }  {
@@ -134,14 +134,14 @@ export default {
 		output += `
 			${ appendSelectors( selector, '> .alignleft' ) } {
 				float: left;
-				margin-right: 2em;
-				margin-left: 0;
+				margin-inline-end: 2em;
+				margin-inline-start: 0;
 			}
 
 			${ appendSelectors( selector, '> .alignright' ) } {
 				float: right;
-				margin-left: 2em;
-				margin-right: 0;
+				margin-inline-start: 2em;
+				margin-inline-end: 0;
 			}
 
 		`;
@@ -149,11 +149,11 @@ export default {
 		if ( hasBlockGapStylesSupport ) {
 			output += `
 				${ appendSelectors( selector, '> *' ) } {
-					margin-top: 0;
-					margin-bottom: 0;
+					margin-block-start: 0;
+					margin-block-end: 0;
 				}
 				${ appendSelectors( selector, '> * + *' ) } {
-					margin-top: ${ blockGapValue };
+					margin-block-start: ${ blockGapValue };
 				}
 			`;
 		}