Bug 1520946: Shrink some content in various w3c-submitted flexbox tests so that they won't trigger scrollbars in WPT harness. r=TYLin

All of these tests have an .ini file indicating a failure for at least one of
them right now, in the copy that lives in the WPT harness, because
 - they trigger a scrollbar in the WPT harness
...and:
 - the scrollbar is a slightly different size in the reference case vs.
   in one of the testcases, e.g. due to a tiny margin being honored (or not)
   on the final piece of content.

This patch shrinks the content a bit in these test files so that they all fit
in a 400x400 viewport and won't trigger a scrollbar. I expect this should make
them pass in the WPT harness when they make the roundtrip through our
synchronization process.

Differential Revision: https://phabricator.services.mozilla.com/D16935

--HG--
extra : moz-landing-system : lando

layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001-ref.xhtml

@@ -12,24 +12,24 @@
         width: 200px;
         margin-bottom: 2px;
         background: lightgray;
-        height: 20px;
+        height: 10px;
         clear: all;
       }
       div.a {
         width: 10px;
-        height: 20px;
+        height: 10px;
         background: lightgreen;
         float: left;
       }
       div.b {
         width: 30px;
-        height: 20px;
+        height: 10px;
         background: pink;
         float: left;
       }
       div.c {
         width: 40px;
-        height: 20px;
+        height: 10px;
         background: orange;
         float: left;
       }
@@ -37,7 +37,7 @@
       /* Inside of 'b': */
       div.fixedSizeChild {
         width: 30px;
-        height: 10px;
+        height: 5px;
         background: purple;
       }
     </style>

layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001a.xhtml

@@ -14,7 +14,7 @@
     <style>
       div.flexbox {
         width: 200px;
-        height: 20px; /* Short, to force us to wrap */
+        height: 10px; /* Short, to force us to wrap */
         display: flex;
         flex-direction: column;
         flex-wrap: wrap;
@@ -23,19 +23,19 @@
       }
       div.a {
         width: 10px;
-        height: 20px;
+        height: 10px;
         flex: none;
         background: lightgreen;
       }
       div.b {
         width: auto; /* width comes from contents */
-        height: 20px;
+        height: 10px;
         flex: none;
         background: pink;
       }
       div.c {
         width: 40px;
-        height: 20px;
+        height: 10px;
         flex: none;
         background: orange;
       }
@@ -43,7 +43,7 @@
       /* Inside of 'b': */
       div.fixedSizeChild {
         width: 30px;
-        height: 10px;
+        height: 5px;
         background: purple;
       }
     </style>

layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-001b.xhtml

@@ -15,7 +15,7 @@
     <style>
       div.flexbox {
         width: 200px;
-        max-height: 20px; /* Short, to force us to wrap */
+        max-height: 10px; /* Short, to force us to wrap */
         display: flex;
         flex-direction: column;
         flex-wrap: wrap;
@@ -24,19 +24,19 @@
       }
       div.a {
         width: 10px;
-        height: 20px;
+        height: 10px;
         flex: none;
         background: lightgreen;
       }
       div.b {
         width: auto; /* width comes from contents */
-        height: 20px;
+        height: 10px;
         flex: none;
         background: pink;
       }
       div.c {
         width: 40px;
-        height: 20px;
+        height: 10px;
         flex: none;
         background: orange;
       }
@@ -44,7 +44,7 @@
       /* Inside of 'b': */
       div.fixedSizeChild {
         width: 30px;
-        height: 10px;
+        height: 5px;
         background: purple;
       }
     </style>

layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001-ref.xhtml

@@ -16,17 +16,17 @@
         display: inline-block;
       }
       div.a {
-        height: 20px;
+        height: 10px;
         width: 10px;
         background: lightgreen;
       }
       div.b {
-        height: 20px;
+        height: 10px;
         width: 50px;
         background: pink;
       }
       div.c {
-        height: 20px;
+        height: 10px;
         width: 100px;
         background: orange;
       }

layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001a.xhtml

@@ -18,17 +18,17 @@
         margin-bottom: 2px;
       }
       div.a {
-        height: 20px;
+        height: 10px;
         flex: 0 10px;
         background: lightgreen;
       }
       div.b {
-        height: 20px;
+        height: 10px;
         flex: 0 50px;
         background: pink;
       }
       div.c {
-        height: 20px;
+        height: 10px;
         flex: 0 100px;
         background: orange;
       }

layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-horiz-001b.xhtml

@@ -24,17 +24,17 @@
         clear: both;
       }
       div.a {
-        height: 20px;
+        height: 10px;
         flex: 0 10px;
         background: lightgreen;
       }
       div.b {
-        height: 20px;
+        height: 10px;
         flex: 0 50px;
         background: pink;
       }
       div.c {
-        height: 20px;
+        height: 10px;
         flex: 0 100px;
         background: orange;
       }

layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-003-ref.xhtml

@@ -15,17 +15,17 @@
         float: left;
       }
       div.a {
-        width: 20px;
+        width: 10px;
         height: 35px;
         background: lightgreen;
       }
       div.b {
-        width: 20px;
+        width: 10px;
         height: 40px;
         background: pink;
       }
       div.c {
-        width: 20px;
+        width: 10px;
         height: 45px;
         background: orange;
       }

layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-003.xhtml

@@ -29,17 +29,17 @@
         float: left;
       }
       div.a {
-        width: 20px;
+        width: 10px;
         flex: 0 0 35px;
         background: lightgreen;
       }
       div.b {
-        width: 20px;
+        width: 10px;
         flex: 0 0 40px;
         background: pink;
       }
       div.c {
-        width: 20px;
+        width: 10px;
         flex: 0 0 45px;
         background: orange;
       }