Bug 1620476 - Fix a test that makes assumptions about the padding of a textarea. r=mstange

The test is duplicated in two places, so four files to change. The padding in
the non-native theme is just big enough so that the textarea overlaps the float.

In other themes the textarea overflows, but not enough to hit the float.

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

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

layout/reftests/floats/float-outside-block-push-ref.html

@@ -7,8 +7,8 @@
 #wrap {width:600px; border:1px solid;position:relative}
 .a {background:lime; color:#fff; width:80%;}
 .b {position:absolute; right:0; width:18%; background: cyan; color: #000; height:10em;}
-textarea {width: 100%; height:10em;}
-</style> 
+textarea {box-sizing: border-box; width: 100%; height:10em;}
+</style>
 
 <title>test</title>
 </head>

layout/reftests/floats/float-outside-block-push.html

@@ -11,7 +11,7 @@
 #wrap {width:600px; border:1px solid;}
 .a {background:lime; color:#fff; width:80%;}
 .b {float:right; width:18%; background: cyan; color: #000; height:10em;}
-textarea {width: 100%; height:10em;}
+textarea {box-sizing: border-box; width: 100%; height:10em;}
 </style> 
 
 <title>test</title>

testing/web-platform/tests/css/CSS2/floats/floats-wrap-bfc-outside-001-ref.xht

@@ -5,7 +5,7 @@
 #wrap {width:600px; border:1px solid;position:relative}
 .a {background:lime; color:#fff; width:80%;}
 .b {position:absolute; right:0; width:18%; background: cyan; color: #000; height:10em;}
-textarea {width: 100%; height:10em;}
+textarea {box-sizing: border-box; width: 100%; height:10em;}
 </style>
 
 <title>test</title>

testing/web-platform/tests/css/CSS2/floats/floats-wrap-bfc-outside-001.xht

@@ -10,7 +10,7 @@
 #wrap {width:600px; border:1px solid;}
 .a {background:lime; color:#fff; width:80%;}
 .b {float:right; width:18%; background: cyan; color: #000; height:10em;}
-textarea {width: 100%; height:10em;}
+textarea {box-sizing: border-box;width: 100%; height:10em;}
 </style>
 
 </head>

testing/web-platform/tests/html/rendering/widgets/baseline-alignment-and-overflow.tentative.html

@@ -213,6 +213,8 @@ This table gets populated by the script.
 
     for (const row of testTBody.children) {
       const input = row.firstChild.lastElementChild;
+      // FIXME: This test makes assumptions about default form control styling
+      // that don't hold in all platforms.
       const allowedDelta = 3;
       // This is not using test() because promise_setup() only allows promise_test().
       promise_test(async () => {