Tweak flexbox_justifycontent-center-overflow.html to match implementations (#26256)

The offsets -2.85em and 4.95em in the ref perhaps (at a guess) initially
matched precisely the Presto behavior, but now look like magic
constants, and is slightly off in all implementations:
https://wpt.fyi/results/css/css-flexbox/flexbox_justifycontent-center-overflow.html?run_id=711240001&run_id=697770002&run_id=737900001&run_id=715540002&run_id=705490001

Control the width of the boxes more explicitly, so that the ref can be
written in a more straightforward way.

Also replaces "dam" (lady in Norwegian) with "x" to make the text much
shorter than the span widths, and matching an earlier rewrite:
#16820

Author: foolip

css/css-flexbox/flexbox_justifycontent-center-overflow-ref.html

@@ -12,24 +12,26 @@
 	position: relative;
 }
 span {
-	background: yellow;
-	margin: 1em 0 0 -2.85em;
+    background: white;
+	margin: 1em;
+	width: 2em;
 	height: 6em;
-	display: inline-block;
+	display: block;
+	position: absolute;
+}
+span:nth-child(1) {
+	background: yellow;
+	left: -4em;
 }
 span:nth-child(2) {
 	background: pink;
-	margin-left: 2em;
 }
 span:nth-child(3) {
 	background: lightblue;
-	margin-left: 0;
-	position: relative;
-	top: -7em;
-	left: 4.95em
+	left: 4em;
 }
 </style>
 
 <div>
-	<span>dam</span><span>dam</span><span>dam</span>
+	<span>x</span><span>x</span><span>x</span>
 </div>

css/css-flexbox/flexbox_justifycontent-center-overflow.html

@@ -8,7 +8,6 @@
 div {
 	font-family: monospace;
 	background: blue;
-	padding: 0;
 	margin: 1em 0 0 10em;
 	border: 1px solid black;
 	height: 8em;
@@ -20,8 +19,8 @@
 span {
 	background: white;
 	margin: 1em;
-	width: 5em;
-	max-width: 6em;
+	min-width: 2em;
+	max-width: 2em;
 	display: inline-block;
 
 	flex: 1 0 0%;
@@ -32,5 +31,5 @@
 </style>
 
 <div>
-	<span>dam</span><span>dam</span><span>dam</span>
+	<span>x</span><span>x</span><span>x</span>
 </div>