Bug 1490747 part 2 - Center the <legend> border-box (not its margin-box) within the <fieldset> border area. (tests) r=dholbert
authorMats Palmgren <mats@mozilla.com>
Fri, 12 Oct 2018 21:36:04 +0200
changeset 499535 83fca840ea7f02901d0ad92a09a28120b1bc82a6
parent 499534 8f7a45eb3e5116e2ff06d867a14a2464f0bab306
child 499536 7a60706c7063d3de4c0a395bda5ffbc5a467c262
push id1864
push userffxbld-merge
push dateMon, 03 Dec 2018 15:51:40 +0000
treeherdermozilla-release@f040763d99ad [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdholbert
bugs1490747
milestone64.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1490747 part 2 - Center the <legend> border-box (not its margin-box) within the <fieldset> border area. (tests) r=dholbert
testing/web-platform/meta/MANIFEST.json
testing/web-platform/meta/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins.html.ini
testing/web-platform/tests/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2-ref.html
testing/web-platform/tests/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2.html
--- a/testing/web-platform/meta/MANIFEST.json
+++ b/testing/web-platform/meta/MANIFEST.json
@@ -185954,16 +185954,28 @@
       [
        "/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-ref.html",
        "=="
       ]
      ],
      {}
     ]
    ],
+   "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2.html": [
+    [
+     "/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2.html",
+     [
+      [
+       "/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2-ref.html",
+       "=="
+      ]
+     ],
+     {}
+    ]
+   ],
    "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-display-none-rendering.html": [
     [
      "/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-display-none-rendering.html",
      [
       [
        "/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-display-none-rendering-ref.html",
        "=="
       ]
@@ -288807,16 +288819,21 @@
      {}
     ]
    ],
    "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-ref.html": [
     [
      {}
     ]
    ],
+   "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2-ref.html": [
+    [
+     {}
+    ]
+   ],
    "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-display-none-rendering-ref.html": [
     [
      {}
     ]
    ],
    "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-display-rendering-ref.html": [
     [
      {}
@@ -608834,16 +608851,24 @@
   "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-ref.html": [
    "f2701d26f3213e02eee9d3592bbeae7da7e7b898",
    "support"
   ],
   "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins.html": [
    "98cd16c7c147316669eb6c456538f43ae90fbf44",
    "reftest"
   ],
+  "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2-ref.html": [
+   "f3975502148a936856a25722a1c80d59322c11f3",
+   "support"
+  ],
+  "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2.html": [
+   "bfca4b86a6ae4399d4f8ea5d0cfadbb234d79b88",
+   "reftest"
+  ],
   "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-display-none-rendering-ref.html": [
    "e6eff47e53c7a40e973b7f9dc298af2343f59941",
    "support"
   ],
   "html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-display-none-rendering.html": [
    "abf3c45df71ee6617ddb8b6d402a103f54624820",
    "reftest"
   ],
deleted file mode 100644
--- a/testing/web-platform/meta/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins.html.ini
+++ /dev/null
@@ -1,2 +0,0 @@
-[legend-block-margins.html]
-  expected: FAIL
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2-ref.html
@@ -0,0 +1,142 @@
+<!DOCTYPE HTML>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+  <meta charset="utf-8">
+  <title>Reference for legend block-axis margins</title>
+<style>
+.fieldset {
+  display: block;
+  position: relative;
+  width: 40px;
+  border: 2px solid blue;
+  padding: 4px;
+}
+.legend {
+  display: block;
+  position: absolute;
+  width: 10px;
+  height: 20px;
+  padding: 0;
+  margin: 0;
+  background: grey;
+}
+
+.t2 .fieldset { border-top-width: 12px; }
+.t3 .fieldset { border-top-width: 12px; }
+.t3 .legend { height: 12px; background:white; }
+.legend > x { display:block; position:relative; height:6px; background:grey; margin-top:3px; }
+
+div { border: 1px solid;  margin: 0 2px 10px 0; }
+c { display:block; height:10px; background: lightgrey; }
+f { float: left; }
+</style>
+</head>
+<body>
+
+<f>
+<div>
+  <span class="fieldset" style="margin-top:9px"><span class="legend" style="top:-11px"></span><c style="margin-top:9px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset" style="margin-top:19px"><span class="legend" style="top:-11px"></span><c style="margin-top:9px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="top:-12px"></span><c style="margin-top:8px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="top:-20px"></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="top:-20px"></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset" style="margin-top:9px"><span class="legend" style="top:-11px"></span><c style="margin-top:19px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset" style="margin-top:9px"><span class="legend" style="top:-11px"></span><c style="margin-top:29px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="top:-2px; z-index:1"></span><c style="position:relative; z-index:1"></c></span>
+</div>
+</f>
+
+<f class=t2>
+<div>
+  <span class="fieldset" style="margin-top:4px"><span class="legend" style="top:-16px"></span><c style="margin-top:4px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset" style="margin-top:14px"><span class="legend" style="top:-16px"></span><c style="margin-top:4px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="top:-20px"></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="top:-20px"></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="top:-20px"></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset" style="margin-top:4px"><span class="legend" style="top:-16px"></span><c style="margin-top:14px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset" style="margin-top:4px"><span class="legend" style="top:-16px"></span><c style="margin-top:24px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="top:-12px; height:16px"></span><c></c></span>
+</div>
+</f>
+
+<f class=t3>
+<div>
+  <span class="fieldset"><span class="legend" style="margin-top: -16px"><x></x></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset" style="margin-top: 4px"><span class="legend" style="margin-top: -16px"><x style="top:3px"></x></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="margin-top: -16px"><x></x></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="margin-top: -16px"><x></x></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="margin-top: -16px"><x></x></span><c></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="margin-top: -16px"><x style="top:-3px"></x></span><c style="margin-top:4px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="margin-top: -16px"><x style="top:-3px"></x></span><c style="margin-top:14px"></c></span>
+</div>
+
+<div>
+  <span class="fieldset"><span class="legend" style="margin-top: -16px"><x></x></span><c></c></span>
+</div>
+</f>
+
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/html/rendering/non-replaced-elements/the-fieldset-and-legend-elements/legend-block-margins-2.html
@@ -0,0 +1,139 @@
+<!DOCTYPE HTML>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+  <meta charset="utf-8">
+  <title>legend block-axis margins</title>
+  <link rel="match" href="legend-block-margins-2-ref.html">
+<style>
+fieldset {
+  width: 40px;
+  border: 2px solid blue;
+  padding: 4px;
+  margin: 0;
+}
+legend {
+  width: 10px;
+  height: 20px;
+  padding: 0;
+  background: grey;
+
+}
+
+.t2 fieldset { border-top-width: 12px; }
+.t3 fieldset { border-top-width: 12px; }
+.t3 legend { height: 6px; }
+
+div { border: 1px solid;  margin: 0 2px 10px 0; }
+c { display:block; height:10px; background: lightgrey; }
+f { float: left; }
+</style>
+</head>
+<body>
+
+<f>
+<div>
+  <fieldset><legend></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: 10px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: -10px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: -20px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: -30px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-bottom: 10px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-bottom: 20px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-bottom: -20px"></legend><c></c></fieldset>
+</div>
+</f>
+
+<f class=t2>
+<div>
+  <fieldset><legend></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: 10px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: -10px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: -20px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: -30px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-bottom: 10px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-bottom: 20px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-bottom: -20px"></legend><c></c></fieldset>
+</div>
+</f>
+
+<f class=t3>
+<div>
+  <fieldset><legend></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: 10px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: -10px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: -20px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-top: -30px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-bottom: 10px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-bottom: 20px"></legend><c></c></fieldset>
+</div>
+
+<div>
+  <fieldset><legend style="margin-bottom: -20px"></legend><c></c></fieldset>
+</div>
+</f>
+
+</body>
+</html>