Block Library: Flatten width calculation of gallery columns (#20690)

* Block Library: Flatten width calculation of gallery columns

* Block Library: Gallery: Split gutter by number of columns

packages/block-library/src/gallery/style.scss

@@ -84,7 +84,7 @@
 	// On mobile and responsive viewports, we allow only 1 or 2 columns at the most.
 	& .blocks-gallery-image,
 	& .blocks-gallery-item {
-		width: calc((100% - #{ $grid-unit-20 }) / 2);
+		width: calc(50% - #{ $grid-unit-20 });
 
 		&:nth-of-type(even) {
 			margin-right: 0;
@@ -102,15 +102,8 @@
 		@for $i from 3 through 8 {
 			&.columns-#{ $i } .blocks-gallery-image,
 			&.columns-#{ $i } .blocks-gallery-item {
-				width: calc((100% - #{ $grid-unit-20 } * #{ $i - 1 }) / #{ $i });
-				margin-right: 16px;
-
-				// Rules inside this query are only run by Microsoft Edge.
-				// Edge miscalculates `calc`, so we have to add some buffer.
-				// See also https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/15637241/
-				@supports (-ms-ime-align:auto) {
-					width: calc((100% - #{ $grid-unit-20 } * #{ $i - 1 }) / #{ $i } - 1px);
-				}
+				width: calc(#{ 100% / $i } - #{ $grid-unit-20 * ( $i - 1 ) / $i });
+				margin-right: $grid-unit-20;
 			}
 		}