Media & Text: Add spacing block supports (#43456)

* Add spacing supports to Media & Text blocks.

* Add border-box styles.

* Fix merge issues and add back reference guide update.

docs/reference-guides/core-blocks.md

@@ -365,7 +365,7 @@ Set media and words side-by-side for a richer layout. ([Source](https://github.c
 
 -	**Name:** core/media-text
 -	**Category:** media
--	**Supports:** align (full, wide), anchor, color (background, gradients, link, text), typography (fontSize, lineHeight), ~~html~~
+-	**Supports:** align (full, wide), anchor, color (background, gradients, link, text), spacing (margin, padding), typography (fontSize, lineHeight), ~~html~~
 -	**Attributes:** align, focalPoint, href, imageFill, isStackedOnMobile, linkClass, linkDestination, linkTarget, mediaAlt, mediaId, mediaLink, mediaPosition, mediaSizeSlug, mediaType, mediaUrl, mediaWidth, rel, verticalAlignment
 
 ## Unsupported

packages/block-library/src/media-text/block.json

@@ -98,6 +98,10 @@
 				"text": true
 			}
 		},
+		"spacing": {
+			"margin": true,
+			"padding": true
+		},
 		"typography": {
 			"fontSize": true,
 			"lineHeight": true,

packages/block-library/src/media-text/style.scss

@@ -6,6 +6,8 @@
 	display: grid;
 	grid-template-columns: 50% 1fr;
 	grid-template-rows: auto;
+	// This block has customizable padding, border-box makes that more predictable.
+	box-sizing: border-box;
 
 	&.has-media-on-the-right {
 		grid-template-columns: 1fr 50%;