Bug 1169837 - Remove box-sizing: padding-box in FF UI & Gecko Tests. r=dholbert

2024-09-13 09:24:08 -07:00 · 2015-06-02 08:46:00 -04:00 · 2015-06-02 08:46:00 -04:00 · a09420327f
commit a09420327f
parent a2052a2def
33 changed files with 16 additions and 406 deletions
--- a/browser/components/privatebrowsing/content/aboutPrivateBrowsing.css
+++ b/browser/components/privatebrowsing/content/aboutPrivateBrowsing.css
@ -8,7 +8,7 @@

 body {
  display: flex;
-  box-sizing: padding-box;
+  box-sizing: border-box;
  min-height: 100vh;
  padding: 0 48px;
  align-items: center;
--- a/browser/themes/linux/searchbar.css
+++ b/browser/themes/linux/searchbar.css
@ -168,7 +168,7 @@ searchbar[oneoffui] .search-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon
 }

 .searchbar-engine-one-off-item:not(.last-row) {
-  box-sizing: padding-box;
+  box-sizing: content-box;
  border-bottom: 1px solid #ccc;
 }

--- a/browser/themes/osx/searchbar.css
+++ b/browser/themes/osx/searchbar.css
@ -191,7 +191,7 @@ searchbar[oneoffui] .search-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon
 }

 .searchbar-engine-one-off-item:not(.last-row) {
-  box-sizing: padding-box;
+  box-sizing: content-box;
  border-bottom: 1px solid #ccc;
 }

--- a/browser/themes/shared/aboutNetError.css
+++ b/browser/themes/shared/aboutNetError.css
@ -6,7 +6,7 @@

 body {
  display: flex;
-  box-sizing: padding-box;
+  box-sizing: border-box;
  min-height: 100vh;
  padding: 0 48px;
  align-items: center;
--- a/browser/themes/windows/searchbar.css
+++ b/browser/themes/windows/searchbar.css
@ -225,7 +225,7 @@ searchbar[oneoffui] .search-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon
 }

 .searchbar-engine-one-off-item:not(.last-row) {
-  box-sizing: padding-box;
+  box-sizing: content-box;
  border-bottom: 1px solid #ccc;
 }

--- a/dom/base/test/test_bug320799.html
+++ b/dom/base/test/test_bug320799.html
@ -11,7 +11,7 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=320799
 <body>
 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=320799">Mozilla Bug 320799</a>
 <p id="display">
-  <select id="s" style="width: 100px; box-sizing: padding-box">
+  <select id="s" style="width: 100px; box-sizing: border-box; border: 0">
    <option>This is a test, it really is a test I tell you</option>
  </select>
  <select id="s2">
--- a/layout/forms/test/test_textarea_resize.html
+++ b/layout/forms/test/test_textarea_resize.html
@ -25,7 +25,7 @@ var currentResize = -1;
 var currentBoxSizing = 0;
 var currentPointer = 0;
 var resizeTypes = [ "horizontal", "vertical", "none", "inherit", "both" ];
-var boxSizingTypes = [ "", "border-box", "padding-box" ];
+var boxSizingTypes = [ "", "border-box" ];
 var pointerTypes = [ synthesizeMouse, synthesizeTouch]

 function doTheTest() {
--- a/layout/reftests/box-properties/box-sizing-1-ref.html
+++ b/layout/reftests/box-properties/box-sizing-1-ref.html
@ -46,18 +46,6 @@

 </div></td>

-<td id="bspadding"><div>
-<!-- box-sizing: padding-box -->
-<div style="width: 37px">A B</div>
-<div style="width: auto">A B</div>
-<div style="width: auto">A<br>B</div>
-<div style="width: auto">A B</div>
-<div style="width: 37px">A B</div>
-<div style="width: 38px">A B</div>
-<div style="width: 48px">A B</div>
-
-</div></td>
-
 <td id="bsborder"><div>
 <!-- box-sizing: border-box -->
 <div style="width: 37px">A B</div>
--- a/layout/reftests/box-properties/box-sizing-1.html
+++ b/layout/reftests/box-properties/box-sizing-1.html
@ -13,7 +13,6 @@
    td > div { width: 100px; }

    td#bscontent > div > div { box-sizing: content-box; }
-    td#bspadding > div > div { box-sizing: padding-box; }
    td#bsborder > div > div { box-sizing: border-box; }

    td > div > div {
@ -47,18 +46,6 @@

 </div></td>

-<td id="bspadding"><div>
-<!-- box-sizing: padding-box -->
-<div style="width: auto">A B</div>
-<div style="width: -moz-max-content">A B</div>
-<div style="width: -moz-min-content">A B</div>
-<div style="width: -moz-fit-content">A B</div>
-<div style="width: -moz-available">A B</div>
-<div style="width: 50px">A B</div>
-<div style="width: 60%">A B</div>
-
-</div></td>
-
 <td id="bsborder"><div>
 <!-- box-sizing: border-box -->
 <div style="width: auto">A B</div>
--- a/layout/reftests/box-properties/box-sizing-2-ref.html
+++ b/layout/reftests/box-properties/box-sizing-2-ref.html
@ -39,17 +39,6 @@

 </td>

-<td id="bspadding">
-<!-- box-sizing: padding-box -->
-<table><tr><td><div>A B</div></td></tr></table>
-<table><tr><td><div>A B</div></td></tr></table>
-<table><tr><td><div>A<br>B</div></td></tr></table>
-<table><tr><td><div>A B</div></td></tr></table>
-<table><tr><td><div>A B</div></td></tr></table>
-<table><tr><td><div style="width: 138px">A B</div></td></tr></table>
-
-</td>
-
 <td id="bsborder">
 <!-- box-sizing: border-box -->
 <table><tr><td><div>A B</div></td></tr></table>
--- a/layout/reftests/box-properties/box-sizing-2.html
+++ b/layout/reftests/box-properties/box-sizing-2.html
@ -11,7 +11,6 @@
    td { border: 1px solid; padding: 1px solid; }

    td#bscontent td > div { box-sizing: content-box; }
-    td#bspadding td > div { box-sizing: padding-box; }
    td#bsborder td > div { box-sizing: border-box; }

    td td > div {
@ -43,17 +42,6 @@

 </td>

-<td id="bspadding">
-<!-- box-sizing: padding-box -->
-<table><tr><td><div style="width: auto">A B</div></td></tr></table>
-<table><tr><td><div style="width: -moz-max-content">A B</div></td></tr></table>
-<table><tr><td><div style="width: -moz-min-content">A B</div></td></tr></table>
-<table><tr><td><div style="width: -moz-fit-content">A B</div></td></tr></table>
-<table><tr><td><div style="width: -moz-available">A B</div></td></tr></table>
-<table><tr><td><div style="width: 150px">A B</div></td></tr></table>
-
-</td>
-
 <td id="bsborder">
 <!-- box-sizing: border-box -->
 <table><tr><td><div style="width: auto">A B</div></td></tr></table>
--- a/layout/reftests/box-properties/box-sizing-3.html
+++ b/layout/reftests/box-properties/box-sizing-3.html
@ -13,7 +13,6 @@
    td > div { width: 100px; }

    td#bscontent > div > div { box-sizing: content-box; }
-    td#bspadding > div > div { box-sizing: padding-box; }
    td#bsborder > div > div { box-sizing: border-box; }

    td > div > div {
@ -47,18 +46,6 @@

 </div></td>

-<td id="bspadding"><div>
-<!-- box-sizing: padding-box -->
-<div style="width: auto">A B</div>
-<div style="width: -moz-max-content">A B</div>
-<div style="width: -moz-min-content">A B</div>
-<div style="width: -moz-fit-content">A B</div>
-<div style="width: -moz-available">A B</div>
-<div style="width: 50px">A B</div>
-<div style="width: 60%">A B</div>
-
-</div></td>
-
 <td id="bsborder"><div>
 <!-- box-sizing: border-box -->
 <div style="width: auto">A B</div>
--- a/layout/reftests/box-properties/box-sizing-4-ref.html
+++ b/layout/reftests/box-properties/box-sizing-4-ref.html
@ -48,18 +48,6 @@

 </div></td>

-<td id="bspadding"><div>
-<!-- box-sizing: padding-box -->
-<div>A B</div>
-<div>A B</div>
-<div>A<br>B</div>
-<div>A B</div>
-<div style="width: 37px">A B</div>
-<div style="width: 38px">A B</div>
-<div style="width: 48px">A B</div>
-
-</div></td>
-
 <td id="bsborder"><div>
 <!-- box-sizing: border-box -->
 <div>A B</div>
--- a/layout/reftests/box-properties/box-sizing-4.html
+++ b/layout/reftests/box-properties/box-sizing-4.html
@ -14,7 +14,6 @@
               direction: rtl; position: relative; }

    td#bscontent > div > div { box-sizing: content-box; }
-    td#bspadding > div > div { box-sizing: padding-box; }
    td#bsborder > div > div { box-sizing: border-box; }

    td > div > div {
@ -59,18 +58,6 @@

 </div></td>

-<td id="bspadding"><div>
-<!-- box-sizing: padding-box -->
-<div style="width: auto">A B</div>
-<div style="width: -moz-max-content">A B</div>
-<div style="width: -moz-min-content">A B</div>
-<div style="width: -moz-fit-content">A B</div>
-<div style="width: -moz-available">A B</div>
-<div style="width: 50px">A B</div>
-<div style="width: 60%">A B</div>
-
-</div></td>
-
 <td id="bsborder"><div>
 <!-- box-sizing: border-box -->
 <div style="width: auto">A B</div>
--- a/layout/reftests/box-properties/box-sizing-mozbox-minmax-height-ref.html
+++ b/layout/reftests/box-properties/box-sizing-mozbox-minmax-height-ref.html
@ -43,10 +43,5 @@ hbox {
 <div><hbox class="cb" style="height:29px;">content-box 20px</hbox></div>


-<div><hbox class="pb" style="height:16px;">padding-box 20px</hbox></div>
-<div><hbox class="pb" style="height:46px;">padding-box 50px</hbox></div>
-<div><hbox class="pb" style="height:16px;">padding-box 20px</hbox></div>
-
-
 </body>
 </html>
--- a/layout/reftests/box-properties/box-sizing-mozbox-minmax-height.html
+++ b/layout/reftests/box-properties/box-sizing-mozbox-minmax-height.html
@ -25,11 +25,6 @@ hbox {
  background:pink;
 }

-.pb {
-  box-sizing:padding-box;
-  background:cyan;
-}
-
    </style>
 </head>
 <body>
@ -44,10 +39,5 @@ hbox {
 <div><hbox class="cb" style="max-height:20px;">content-box 20px</hbox></div>


-<div><hbox class="pb" style="height:20px;">padding-box 20px</hbox></div>
-<div><hbox class="pb" style="min-height:50px;">padding-box 50px</hbox></div>
-<div><hbox class="pb" style="max-height:20px;">padding-box 20px</hbox></div>
-
-
 </body>
 </html>
--- a/layout/reftests/box-sizing/computed-size-reporting-ref.html
+++ b/layout/reftests/box-sizing/computed-size-reporting-ref.html
@ -9,26 +9,14 @@
    box-sizing:border-box;
  }

-  #paddingBox {
-    background:gold;
-    height:100px;
-    box-sizing:padding-box;
-  }
-
 </style>

 <div id="borderBox"></div>
 <p id="heightWidth1"></p>

-<div id="paddingBox"></div>
-<p id="heightWidth2"></p>
 <script>
  var divs = document.getElementsByTagName("div");
  var textEle1 = document.getElementById("heightWidth1");
  textEle1.innerHTML += "height = " + getComputedStyle(divs[0]).height;
  textEle1.innerHTML += ", width = " + getComputedStyle(divs[0]).width;
-
-  var textEle2 = document.getElementById("heightWidth2");
-  textEle2.innerHTML += "height = " + getComputedStyle(divs[1]).height;
-  textEle2.innerHTML += ", width = " + getComputedStyle(divs[1]).width;
 </script>
--- a/layout/reftests/box-sizing/computed-size-reporting.html
+++ b/layout/reftests/box-sizing/computed-size-reporting.html
@ -10,27 +10,14 @@
    border: 20px solid gold;
  }

-  #paddingBox {
-    background:gold;
-    height:100px;
-    box-sizing:padding-box;
-    padding: 20px;
-  }
-
 </style>

 <div id="borderBox"></div>
 <p id="heightWidth1"></p>

-<div id="paddingBox"></div>
-<p id="heightWidth2"></p>
 <script>
  var divs = document.getElementsByTagName("div");
  var textEle1 = document.getElementById("heightWidth1");
  textEle1.innerHTML += "height = " + getComputedStyle(divs[0]).height;
  textEle1.innerHTML += ", width = " + getComputedStyle(divs[0]).width;
-
-  var textEle2 = document.getElementById("heightWidth2");
-  textEle2.innerHTML += "height = " + getComputedStyle(divs[1]).height;
-  textEle2.innerHTML += ", width = " + getComputedStyle(divs[1]).width;
 </script>
--- a/layout/reftests/box-sizing/intrinsic-1a.html
+++ b/layout/reftests/box-sizing/intrinsic-1a.html
@ -4,6 +4,6 @@
    <img src="lime100x100.png"
         style="height: 200px; display: block; visibility: hidden;
                padding: 30px;
-                box-sizing: padding-box;">
+                box-sizing: border-box;">
  </div>
 </body>
--- a/layout/reftests/box-sizing/intrinsic-1b.html
+++ b/layout/reftests/box-sizing/intrinsic-1b.html
@ -4,6 +4,6 @@
    <img src="lime100x100.png"
         style="height: 200px; display: block; visibility: hidden;
                padding: 15% 30px;
-                box-sizing: padding-box;">
+                box-sizing: border-box;">
  </div>
 </body>
--- a/layout/reftests/box-sizing/intrinsic-1d.html
+++ b/layout/reftests/box-sizing/intrinsic-1d.html
@ -4,6 +4,6 @@
    <img src="lime100x100.png"
         style="height: 200px; display: block; visibility: hidden;
                padding: calc(15%) 30px;
-                box-sizing: padding-box;">
+                box-sizing: border-box;">
  </div>
 </body>
--- a/layout/reftests/box-sizing/intrinsic-1e.html
+++ b/layout/reftests/box-sizing/intrinsic-1e.html
@ -4,6 +4,6 @@
    <img src="lime100x100.png"
         style="height: 200px; display: block; visibility: hidden;
                padding: calc(10% + 10px) 30px;
-                box-sizing: padding-box;">
+                box-sizing: border-box;">
  </div>
 </body>
--- a/layout/reftests/box-sizing/intrinsic-1f.html
+++ b/layout/reftests/box-sizing/intrinsic-1f.html
@ -4,6 +4,6 @@
    <img src="lime100x100.png"
         style="height: 200px; display: block; visibility: hidden;
                padding: calc(30px);
-                box-sizing: padding-box;">
+                box-sizing: border-box;">
  </div>
 </body>
--- a/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-001-ref.xht
+++ b/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-001-ref.xht
@ -1,40 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
- <head>
-  <title>CSS Reference: Box Sizing - Padding-Box with specified width/height</title>
-  <link rel="author" title="Scott Johnson" href="mailto:sjohnson@mozilla.com" />
-  <style type="text/css"><![CDATA[
-    .container {
-      width: 300px;
-      border: 2px solid black;
-      position: absolute;
-      left: 25px;
-      top: 25px;
-      background-color: red;
-    }
-
-    .box-sized {
-      width: 140px;
-      z-index: 1;
-      float: left;
-      padding: 0px 5px;
-    }
-
-    #one {
-      background-color: green;
-    }
-
-    #two {
-      background-color: blue;
-    }
-  ]]></style>
- </head>
- <body>
-   The two divs should be side-by-side, not one on top of another. No red should be visible.
-   <br />
-   <div class="container">
-     <div class="box-sized" id="one">LEFT HALF</div>
-     <div class="box-sized" id="two">RIGHT HALF</div>
-   </div>
- </body>
-</html>
--- a/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-001.xht
+++ b/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-001.xht
@ -1,43 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
- <head>
-  <title>CSS Test: Box Sizing - Padding-Box with specified width/height</title>
-  <link rel="author" title="Scott Johnson" href="mailto:sjohnson@mozilla.com" />
-  <link rel="help" href="http://www.w3.org/TR/css3-ui/#box-sizing" />
-  <meta name="assert" content="box-sizing: padding-box should make the element's (percentage) width be the distance from the left padding edge to the right padding edge."/>
-  <style type="text/css"><![CDATA[
-    .container {
-      width: 300px;
-      border: 2px solid black;
-      position: absolute;
-      left: 25px;
-      top: 25px;
-      background-color: red;
-    }
-
-    .box-sized {
-      box-sizing: padding-box;
-      width: 50%;
-      z-index: 1;
-      float: left;
-      padding: 0px 5px;
-    }
-
-    #one {
-      background-color: green;
-    }
-
-    #two {
-      background-color: blue;
-    }
-  ]]></style>
- </head>
- <body>
-   The two divs should be side-by-side, not one on top of another. No red should be visible.
-   <br />
-   <div class="container">
-     <div class="box-sized" id="one">LEFT HALF</div>
-     <div class="box-sized" id="two">RIGHT HALF</div>
-   </div>
- </body>
-</html>
--- a/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-002-ref.xht
+++ b/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-002-ref.xht
@ -1,42 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
- <head>
-  <title>CSS Reference: Box Sizing - Padding-Box with specified width/height</title>
-  <link rel="author" title="Scott Johnson" href="mailto:sjohnson@mozilla.com" />
-  <style type="text/css"><![CDATA[
-    .container {
-      width: 300px;
-      height: 400px;
-      border: 2px solid black;
-      position: absolute;
-      left: 25px;
-      top: 25px;
-      background-color: red;
-    }
-
-    .box-sized {
-      width: 130px;
-      height: 350px;
-      z-index: 1;
-      float: left;
-      padding: 25px 10px;
-    }
-
-    #one {
-      background-color: green;
-    }
-
-    #two {
-      background-color: blue;
-    }
-  ]]></style>
- </head>
- <body>
-   The two divs should be side-by-side, not one on top of another. No red should be visible.
-   <br />
-   <div class="container">
-     <div class="box-sized" id="one">LEFT HALF</div>
-     <div class="box-sized" id="two">RIGHT HALF</div>
-   </div>
- </body>
-</html>
--- a/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-002.xht
+++ b/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-002.xht
@ -1,45 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
- <head>
-  <title>CSS Test: Box Sizing - Padding-Box with specified width/height</title>
-  <link rel="author" title="Scott Johnson" href="mailto:sjohnson@mozilla.com" />
-  <link rel="help" href="http://www.w3.org/TR/css3-ui/#box-sizing" />
-  <meta name="assert" content="box-sizing: padding-box should make the element's (percentage) width be the distance from the left padding edge to the right padding edge and the height be the distance from the top padding edge to the bottom padding edge."/>
-  <style type="text/css"><![CDATA[
-    .container {
-      width: 300px;
-      height: 400px;
-      border: 2px solid black;
-      position: absolute;
-      left: 25px;
-      top: 25px;
-      background-color: red;
-    }
-
-    .box-sized {
-      box-sizing: padding-box;
-      width: 50%;
-      height: 100%;
-      z-index: 1;
-      float: left;
-      padding: 25px 10px;
-    }
-
-    #one {
-      background-color: green;
-    }
-
-    #two {
-      background-color: blue;
-    }
-  ]]></style>
- </head>
- <body>
-   The two divs should be side-by-side, not one on top of another. No red should be visible.
-   <br />
-   <div class="container">
-     <div class="box-sized" id="one">LEFT HALF</div>
-     <div class="box-sized" id="two">RIGHT HALF</div>
-   </div>
- </body>
-</html>
--- a/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-003-ref.xht
+++ b/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-003-ref.xht
@ -1,42 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
- <head>
-  <title>CSS Reference: Box Sizing - Padding-Box with min/max width/height</title>
-  <link rel="author" title="Scott Johnson" href="mailto:sjohnson@mozilla.com" />
-  <style type="text/css"><![CDATA[
-    .container {
-      width: 500px;
-      height: 70px;
-      border: 2px solid black;
-      position: absolute;
-      left: 25px;
-      top: 25px;
-      background-color: red;
-    }
-
-    .box-sized {
-      height: calc(100% - 10px);
-      width: calc(50% - 10px);
-      z-index: 1;
-      float: left;
-      padding: 5px 5px;
-    }
-
-    #one {
-      background-color: green;
-    }
-
-    #two {
-      background-color: blue;
-    }
-  ]]></style>
- </head>
- <body>
-   The two divs should be side-by-side, not one on top of another. No red should be visible.
-   <br />
-   <div class="container">
-     <div class="box-sized" id="one">LEFT HALF</div>
-     <div class="box-sized" id="two">RIGHT HALF</div>
-   </div>
- </body>
-</html>
--- a/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-003.xht
+++ b/layout/reftests/w3c-css/submitted/ui3/box-sizing-padding-box-003.xht
@ -1,49 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
- <head>
-  <title>CSS Test: Box Sizing - Padding-Box with min/max width/height</title>
-  <link rel="author" title="Scott Johnson" href="mailto:sjohnson@mozilla.com" />
-  <link rel="help" href="http://www.w3.org/TR/css3-ui/#box-sizing" />
-  <meta name="assert" content="box-sizing: padding-box should make the element's (calc) width be the distance from the left padding edge to the right padding edge and the height be the distance from the top padding edge to the bottom padding edge."/>
-  <style type="text/css"><![CDATA[
-    .container {
-      min-width: 500px;
-      max-width: 700px;
-      min-height: 70px;
-      max-height: 90px;
-      border: 2px solid black;
-      position: absolute;
-      left: 25px;
-      top: 25px;
-      background-color: red;
-    }
-
-    .box-sized {
-      box-sizing: padding-box;
-      min-width: 250px;
-      max-width: 350px;
-      min-height: 70px;
-      max-height: 90px;
-      z-index: 1;
-      float: left;
-      padding: 5px 5px;
-    }
-
-    #one {
-      background-color: green;
-    }
-
-    #two {
-      background-color: blue;
-    }
-  ]]></style>
- </head>
- <body>
-   The two divs should be side-by-side, not one on top of another. No red should be visible.
-   <br />
-   <div class="container">
-     <div class="box-sized" id="one">LEFT HALF</div>
-     <div class="box-sized" id="two">RIGHT HALF</div>
-   </div>
- </body>
-</html>
--- a/layout/reftests/w3c-css/submitted/ui3/box-sizing-replaced-001.xht
+++ b/layout/reftests/w3c-css/submitted/ui3/box-sizing-replaced-001.xht
@ -21,7 +21,7 @@

      .with-padding {
        padding: 5px 5px;
-        box-sizing: padding-box;
+        box-sizing: border-box;
      }

      #img1 {
--- a/layout/reftests/w3c-css/submitted/ui3/reftest.list
+++ b/layout/reftests/w3c-css/submitted/ui3/reftest.list
@ -5,9 +5,6 @@
 == box-sizing-content-box-001.xht box-sizing-content-box-001-ref.xht
 == box-sizing-content-box-002.xht box-sizing-content-box-002-ref.xht
 == box-sizing-content-box-003.xht box-sizing-content-box-003-ref.xht
-== box-sizing-padding-box-001.xht box-sizing-padding-box-001-ref.xht
-== box-sizing-padding-box-002.xht box-sizing-padding-box-002-ref.xht
-== box-sizing-padding-box-003.xht box-sizing-padding-box-003-ref.xht
 random-if(Android) skip-if((B2G&&browserIsRemote)||Mulet)  == box-sizing-replaced-001.xht box-sizing-replaced-001-ref.xht #bug 982547 # Initial mulet triage: parity with B2G/B2G Desktop
 fuzzy-if(Android,27,874) random-if((B2G&&browserIsRemote)||Mulet) == box-sizing-replaced-002.xht box-sizing-replaced-002-ref.xht # Bug 1128229 # Initial mulet triage: parity with B2G/B2G Desktop
 fuzzy-if(Android,14,869) random-if((B2G&&browserIsRemote)||Mulet) == box-sizing-replaced-003.xht box-sizing-replaced-003-ref.xht # Bug 1128229 # Initial mulet triage: parity with B2G/B2G Desktop
--- a/layout/style/test/property_database.js
+++ b/layout/style/test/property_database.js
@ -1045,7 +1045,7 @@ var gCSSProperties = {
    inherited: false,
    type: CSS_TYPE_LONGHAND,
    initial_values: [ "content-box" ],
-    other_values: [ "border-box", "padding-box" ],
+    other_values: [ "border-box" ],
    invalid_values: [ "margin-box", "content", "padding", "border", "margin" ]
  },
  "-moz-box-sizing": {
@ -1055,7 +1055,7 @@ var gCSSProperties = {
    alias_for: "box-sizing",
    subproperties: [ "box-sizing" ],
    initial_values: [ "content-box" ],
-    other_values: [ "border-box", "padding-box" ],
+    other_values: [ "border-box" ],
    invalid_values: [ "margin-box", "content", "padding", "border", "margin" ]
  },
  "-moz-columns": {
--- a/toolkit/themes/shared/in-content/info-pages.inc.css
+++ b/toolkit/themes/shared/in-content/info-pages.inc.css
@ -7,7 +7,7 @@
 body {
  display: flex;
  flex-direction: column;
-  box-sizing: padding-box;
+  box-sizing: border-box;
  min-height: 100vh;
  padding-top: 0;
  padding-bottom: 0;