import FIREFOX_52_6_0esr_RELEASE from mozilla-esr52 hg repo

This commit is contained in:
Roy Tam 2018-01-19 03:59:58 +08:00
commit dcd9973243
150858 changed files with 23884658 additions and 0 deletions

View file

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: test button "disabled" text style</title>
<style>
button {
color: GrayText;
border-width: 0;
background: transparent;
}
</style>
</head>
<body>
<button>Some text</button>
</body>
</html>

View file

@ -0,0 +1,15 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: test button "disabled" text style</title>
<style>
button {
border-width: 0;
background: transparent;
}
</style>
</head>
<body>
<button disabled>Some text</button>
</body>
</html>

View file

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: test all types of buttons look similar when disabled</title>
</head>
<body>
<button>Some text</button>
<button>Some text</button>
<button>Reset</button>
<button>Submit Query</button>
<br>
<button disabled>Some text</button>
<button disabled>Some text</button>
<button disabled>Reset</button>
<button disabled>Submit Query</button>
</body>
</html>

View file

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: test all types of buttons look similar when disabled</title>
</head>
<body>
<button>Some text</button>
<input type="button" value="Some text">
<input type="reset">
<input type="submit">
<br>
<button disabled>Some text</button>
<input disabled type="button" value="Some text">
<input disabled type="reset">
<input disabled type="submit">
</body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: check disabled and non-disabled buttons look different</title>
</head>
<body>
<button disabled>Some text</button>
</body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: check disabled and non-disabled buttons look different</title>
</head>
<body>
<button>Some text</button>
</body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: check disabled and non-disabled buttons look different</title>
</head>
<body>
<input disabled type="button" value="Some text">
</body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: check disabled and non-disabled buttons look different</title>
</head>
<body>
<input type="button" value="Some text">
</body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: check disabled and non-disabled buttons look different</title>
</head>
<body>
<input disabled type="reset">
</body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: check disabled and non-disabled buttons look different</title>
</head>
<body>
<input type="reset">
</body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: check disabled and non-disabled buttons look different</title>
</head>
<body>
<input disabled type="submit">
</body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Bug 1007278: check disabled and non-disabled buttons look different</title>
</head>
<body>
<input type="submit">
</body>
</html>

View file

@ -0,0 +1,61 @@
<!DOCTYPE HTML>
<html><head>
<meta charset="utf-8">
<title>Testcase for bug 984869</title>
<style type="text/css">
html,body {
color:black; background-color:white; font-size:16px; padding:0; margin:0;
}
.grid, .igrid {
display: grid;
grid: 20px / 20px 20px;
}
.igrid { display:inline-grid; }
.flex, .iflex {
display: flex;
}
.iflex { display:inline-flex; }
.columnset, .block-columnset {
-moz-columns: 2;
-ms-columns: 2;
-webkit-columns: 2;
columns: 2;
}
.block-columnset, .b { display: block; }
a {
position: absolute;
right:0; bottom:0;
width:5px; height:5px;
background: lime;
}
.rel { position:relative; }
button { vertical-align: bottom; }
</style>
</head>
<body>
<button><wrap class="grid">x<span>y</span>z</wrap></button>
<button><wrap class="iflex">x<span>y</span>z</wrap></button>
<button><wrap class="b columnset">x<br><span>y</span>z</wrap></button>
<button class="rel"><wrap class="grid">x<span>y</span>z<a></a></wrap></button>
<button class="rel"><wrap class="iflex">x<span>y</span>z<a></a></wrap></button>
<button class="rel"><wrap class="b columnset">x<br><span>y</span>z<a></a></wrap></button>
<button class="b"><wrap class="grid">x<span>y</span>z</wrap></button>
<button class="b"><wrap class="flex">x<span>y</span>z</wrap></button>
<button class="b"><wrap class="b columnset">x<br><span>y</span>z</wrap></button>
<button class="rel b"><wrap class="grid">x<span>y</span>z<a></a></wrap></button>
<button class="rel b"><wrap class="flex">x<span>y</span>z<a></a></wrap></button>
<button class="rel b"><wrap class="b columnset">x<br><span>y</span>z<a></a></wrap></button>
</body>
</html>

View file

@ -0,0 +1,61 @@
<!DOCTYPE HTML>
<html><head>
<meta charset="utf-8">
<title>Testcase for bug 984869</title>
<style type="text/css">
html,body {
color:black; background-color:white; font-size:16px; padding:0; margin:0;
}
.grid, .igrid {
display: grid;
grid: 20px / 20px 20px;
}
.igrid { display:inline-grid; }
.flex, .iflex {
display: flex;
}
.iflex { display:inline-flex; }
.columnset {
-moz-columns: 2;
-ms-columns: 2;
-webkit-columns: 2;
columns: 2;
}
.b { display: block; }
a {
position: absolute;
right:0; bottom:0;
width:5px; height:5px;
background: lime;
}
.rel { position:relative; }
button { vertical-align: bottom; }
</style>
</head>
<body>
<button class="igrid">x<span>y</span>z</button>
<button class="iflex">x<span>y</span>z</button>
<button class="columnset">x<br><span>y</span>z</button>
<button class="rel igrid">x<span>y</span>z<a></a></button>
<button class="rel iflex">x<span>y</span>z<a></a></button>
<button class="rel columnset">x<br><span>y</span>z<a></a></button>
<button class="grid">x<span>y</span>z</button>
<button class="flex">x<span>y</span>z</button>
<button class="b columnset">x<br><span>y</span>z</button>
<button class="rel grid">x<span>y</span>z<a></a></button>
<button class="rel flex">x<span>y</span>z<a></a></button>
<button class="rel b columnset">x<br><span>y</span>z<a></a></button>
</body>
</html>

View file

@ -0,0 +1,5 @@
<!DOCTYPE html>
<style>
body { line-height: 0; }
</style>
<button>Some text</button>

View file

@ -0,0 +1,7 @@
<!DOCTYPE html>
<style>
button { display: block; }
button::first-letter { color: green; }
body { line-height: 0; }
</style>
<button>Some text</button>

View file

@ -0,0 +1,6 @@
<!DOCTYPE html>
<style>
button::first-letter { color: green; }
body { line-height: 0; }
</style>
<button>Some text</button>

View file

@ -0,0 +1,52 @@
<!DOCTYPE html>
<!-- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/ -->
<html>
<head>
<title>Reference case for bug 1272983</title>
<style>
/* Set explicit font size so that em units are predictable: */
body, button { font: 10px sans-serif; }
/* Set margin to 0 for all cases. In the first 6, that's how we expect
the testcase to render; and in the 7th and 8th, our reference margin
will be applied via a child div instead of via the pseudo-element. */
button.mfi1::-moz-focus-inner,
button.mfi2::-moz-focus-inner,
button.mfi3::-moz-focus-inner,
button.mfi4::-moz-focus-inner,
button.mfi5::-moz-focus-inner,
button.mfi6::-moz-focus-inner,
button.mfi7::-moz-focus-inner,
button.mfi8::-moz-focus-inner { margin: 0; }
/* Use an explicit div instead of pseudo-element, for reference case's
version of margin values that we actually expect to take effect: */
button.mfi7 > div { margin: 10px; }
button.mfi8 > div { margin: 20px; /* = 2em * 20px/em */ }
</style>
</head>
<body>
<button class="mfi1">mfi1</button>
<button class="mfi2">mfi2</button>
<button class="mfi3">mfi3</button>
<button class="mfi4">mfi4</button>
<br>
<button class="mfi5">mfi5</button>
<button class="mfi6">mfi6</button>
<button class="mfi7"><div>mfi7</div></button>
<button class="mfi8"><div>mfi8</div></button>
<br>
<button class="mfo1">mfo1</button>
<button class="mfo2">mfo2</button>
<button class="mfo3">mfo3</button>
<button class="mfo4">mfo4</button>
<br>
<button class="mfo5">mfo5</button>
<button class="mfo6">mfo6</button>
<button class="mfo7">mfo7</button>
<button class="mfo8">mfo8</button>
<br>
</body>
</html>

View file

@ -0,0 +1,62 @@
<!DOCTYPE html>
<!-- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/ -->
<html>
<!-- The ::-moz-focus-inner & ::-moz-focus-outer button pseudo-elements only
support CSS "margin" values that contain absolute lengths. Any percent or
"auto" margin values will simply make the margin collapse to zero.
This test verifies that this is indeed what happens (not anything worse).
-->
<head>
<title>Testcase for bug 1272983</title>
<style>
/* Set explicit font size so that em units are predictable: */
body, button { font: 10px sans-serif; }
/* Testing percent and auto margin values on "-moz-focus-inner": */
button.mfi1::-moz-focus-inner { margin: 50%; }
button.mfi2::-moz-focus-inner { margin: 50% 10px; }
button.mfi3::-moz-focus-inner { margin: 10px 50%; }
button.mfi4::-moz-focus-inner { margin: auto; }
button.mfi5::-moz-focus-inner { margin: auto 10px; }
button.mfi6::-moz-focus-inner { margin: 10px auto; }
button.mfi7::-moz-focus-inner { margin: 10px; }
button.mfi8::-moz-focus-inner { margin: 2em; }
/* Testing percent and auto margin values on "-moz-focus-outer":
(just for completeness -- really, 'margin' has no effect on
the behavior of -moz-focus-outer) */
button.mfo1::-moz-focus-outer { margin: 50%; }
button.mfo2::-moz-focus-outer { margin: 50% 10px; }
button.mfo3::-moz-focus-outer { margin: 10px 50%; }
button.mfo4::-moz-focus-outer { margin: auto; }
button.mfo5::-moz-focus-outer { margin: auto 10px; }
button.mfo6::-moz-focus-outer { margin: 10px auto; }
button.mfo7::-moz-focus-outer { margin: 10px; }
button.mfo8::-moz-focus-outer { margin: 2em; }
</style>
</head>
<body>
<button class="mfi1">mfi1</button>
<button class="mfi2">mfi2</button>
<button class="mfi3">mfi3</button>
<button class="mfi4">mfi4</button>
<br>
<button class="mfi5">mfi5</button>
<button class="mfi6">mfi6</button>
<button class="mfi7">mfi7</button>
<button class="mfi8">mfi8</button>
<br>
<button class="mfo1">mfo1</button>
<button class="mfo2">mfo2</button>
<button class="mfo3">mfo3</button>
<button class="mfo4">mfo4</button>
<br>
<button class="mfo5">mfo5</button>
<button class="mfo6">mfo6</button>
<button class="mfo7">mfo7</button>
<button class="mfo8">mfo8</button>
<br>
</body>
</html>

View file

@ -0,0 +1,68 @@
<!DOCTYPE html>
<!-- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/ -->
<html>
<head>
<title>Reference case for bug 1272983</title>
<style>
/* Set explicit font size so that em units are predictable: */
body, button { font: 10px sans-serif; }
/* Add outline to help visualize the padding outside of buttons: */
button { outline: 1px solid black; }
/* Set padding to 0 for all cases. In the first 3, that's how we expect
the testcase to render; and in the 4th and 5th, our reference padding
will be applied via a child div instead of via the pseudo-element. */
button.mfi1::-moz-focus-inner,
button.mfi2::-moz-focus-inner,
button.mfi3::-moz-focus-inner,
button.mfi4::-moz-focus-inner,
button.mfi5::-moz-focus-inner { padding: 0; }
/* Use an explicit div instead of pseudo-element, for reference case's
version of padding values that we actually expect to take effect: */
button.mfi4 > div { padding: 10px; }
button.mfi5 > div { padding: 2em; }
/* As above, set padding to 0 for all cases: */
button.mfo1::-moz-focus-outer,
button.mfo2::-moz-focus-outer,
button.mfo3::-moz-focus-outer,
button.mfo4::-moz-focus-outer,
button.mfo5::-moz-focus-outer { padding: 0; }
/* To make reference for -moz-focus-outer padding that we expect to
take effect, we'll put the padding on a wrapper-div (and bump the
button's outline to that div). */
div.mfo4-wrapper { padding: 10px; }
div.mfo5-wrapper { padding: 20px; /* = 2em * 10px/em */ }
button.mfo4,
button.mfo5 { outline: none; }
div.mfo4-wrapper,
div.mfo5-wrapper { display: inline-block; outline: 1px solid black; }
</style>
</head>
<body>
<button class="mfi1">mfi1</button>
<button class="mfi2">mfi2</button>
<button class="mfi3">mfi3</button>
<br>
<button class="mfi4"><div>mfi4</div></button>
<button class="mfi5"><div>mfi5</div></button>
<br>
<button class="mfo1">mfo1</button>
<button class="mfo2">mfo2</button>
<button class="mfo3">mfo3</button>
<br>
<div class="mfo4-wrapper">
<button class="mfo4">mfo4</button>
</div>
<div class="mfo5-wrapper">
<button class="mfo5">mfo5</button>
</div>
<br>
</body>
</html>

View file

@ -0,0 +1,51 @@
<!DOCTYPE html>
<!-- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/ -->
<html>
<!-- The ::-moz-focus-inner & ::-moz-focus-outer button pseudo-elements only
support CSS "padding" values that contain absolute lengths. Any percent
padding values will simply make the padding collapse to zero.
This test verifies that this is indeed what happens (not anything worse).
-->
<head>
<title>Testcase for bug 1272983</title>
<style>
/* Set explicit font size so that em units are predictable: */
body, button { font: 10px sans-serif; }
/* Add outline to help visualize the padding outside of buttons: */
button { outline: 1px solid black; }
/* Testing percent and auto padding values on "-moz-focus-inner": */
button.mfi1::-moz-focus-inner { padding: 50%; }
button.mfi2::-moz-focus-inner { padding: 50% 10px; }
button.mfi3::-moz-focus-inner { padding: 10px 50%; }
button.mfi4::-moz-focus-inner { padding: 10px; }
button.mfi5::-moz-focus-inner { padding: 2em; }
/* Testing percent and auto padding values on "-moz-focus-outer": */
button.mfo1::-moz-focus-outer { padding: 50%; }
button.mfo2::-moz-focus-outer { padding: 50% 10px; }
button.mfo3::-moz-focus-outer { padding: 10px 50%; }
button.mfo4::-moz-focus-outer { padding: 10px; }
button.mfo5::-moz-focus-outer { padding: 2em; }
</style>
</head>
<body>
<button class="mfi1">mfi1</button>
<button class="mfi2">mfi2</button>
<button class="mfi3">mfi3</button>
<br>
<button class="mfi4">mfi4</button>
<button class="mfi5">mfi5</button>
<br>
<button class="mfo1">mfo1</button>
<button class="mfo2">mfo2</button>
<button class="mfo3">mfo3</button>
<br>
<button class="mfo4">mfo4</button>
<button class="mfo5">mfo5</button>
<br>
</body>
</html>

View file

@ -0,0 +1,7 @@
<!DOCTYPE HTML>
<style>
button { line-height: 0.5 }
</style>
<button>button input</button>

View file

@ -0,0 +1,7 @@
<!DOCTYPE HTML>
<style>
button { line-height: 1.0 }
</style>
<button>button input</button>

View file

@ -0,0 +1,7 @@
<!DOCTYPE HTML>
<style>
button { line-height: 1.5 }
</style>
<button>button input</button>

View file

@ -0,0 +1,7 @@
<!DOCTYPE HTML>
<style>
input { line-height: 0.5 }
</style>
<input type="button" value="button input" size="20">

View file

@ -0,0 +1,7 @@
<!DOCTYPE HTML>
<style>
input { line-height: 1.0 }
</style>
<input type="button" value="button input" size="20">

View file

@ -0,0 +1,7 @@
<!DOCTYPE HTML>
<style>
input { line-height: 1.5 }
</style>
<input type="button" value="button input" size="20">

View file

@ -0,0 +1,11 @@
<!DOCTYPE html>
<style>
button {
height: 50px;
padding: 23px;
border: 1px solid black;
box-sizing: border-box;
overflow: hidden;
}
</style>
<button>Some text</button>

View file

@ -0,0 +1,11 @@
<!DOCTYPE html>
<style>
button {
max-height: 50px;
padding: 23px;
border: 1px solid black;
box-sizing: border-box;
overflow: hidden;
}
</style>
<button>Some text</button>

View file

@ -0,0 +1,17 @@
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style>
.btn1, .btn2 {
border: 5px solid green;
background-color: blue;
height: 50px;
}
</style>
</head>
<body>
<input type='submit' class='btn1' value='' />
<input type='submit' class='btn2' value='' />
</body>
</html>

View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style>
.btn1, .btn2 {
border: 5px solid green;
background-color: blue;
}
.btn1 {
min-height: 50px;
}
.btn2 {
height: 50px;
}
</style>
</head>
<body>
<input type='submit' class='btn1' value='' />
<input type='submit' class='btn2' value='' />
</body>
</html>

View file

@ -0,0 +1,48 @@
<!DOCTYPE html>
<!-- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/ -->
<html>
<head>
<title>Reference case</title>
<style>
input, button {
border: 0; /* Combined, these mean the gray area is the */
background: lightgray; /* border-box size. */
outline: 2px solid black; /* The outlined area is the overflow area. */
width: 1px; /* (To attempt to trigger overflow) */
display: block; /* Put each button on its own line, w/ some margin, */
margin-bottom: 5px; /* so that any overflow doesn't get stomped on. */
font: 8px serif; /* (This just lets the testcase fit better on mobile.) */
}
.oh { overflow: hidden }
</style>
</head>
<body>
<!-- For the reference case, we just put "overflow:hidden" on everything. -->
<input class="oh" type="reset">
<input class="oh" type="submit">
<input class="oh" type="button" value="InputTypeButton">
<!-- ...with one exception: button with (default) overflow:visible.
Such buttons *do* actually allow their contents to overflow. -->
<button>ActualButton</button>
<input class="oh" type="reset">
<input class="oh" type="submit">
<input class="oh" type="button" value="InputTypeButton">
<button class="oh">ActualButton</button>
<input class="oh" type="reset">
<input class="oh" type="submit">
<input class="oh" type="button" value="InputTypeButton">
<button class="oh">ActualButton</button>
<input class="oh" type="reset">
<input class="oh" type="submit">
<input class="oh" type="button" value="InputTypeButton">
<button class="oh">ActualButton</button>
</body>
</html>

View file

@ -0,0 +1,51 @@
<!DOCTYPE html>
<!-- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/ -->
<html>
<!-- For buttons whose painting gets clipped to their border-box area,
we should *also* clip their overflow area (as exposed via 'outline').
This test exposes these areas so they can be visualized, and checks that
they match when we expect them to. -->
<head>
<title>Testcase for bug 1261284</title>
<style>
input, button {
border: 0; /* Combined, these mean the gray area is the */
background: lightgray; /* border-box size. */
outline: 2px solid black; /* The outlined area is the overflow area. */
width: 1px; /* (To attempt to trigger overflow) */
display: block; /* Put each button on its own line, w/ some margin, */
margin-bottom: 5px; /* so that any overflow doesn't get stomped on. */
font: 8px serif; /* (This just lets the testcase fit better on mobile.) */
}
.oh { overflow: hidden }
.oa { overflow: auto }
.os { overflow: scroll }
</style>
</head>
<body>
<input type="reset">
<input type="submit">
<input type="button" value="InputTypeButton">
<button>ActualButton</button>
<input class="oh" type="reset">
<input class="oh" type="submit">
<input class="oh" type="button" value="InputTypeButton">
<button class="oh">ActualButton</button>
<input class="oa" type="reset">
<input class="oa" type="submit">
<input class="oa" type="button" value="InputTypeButton">
<button class="oa">ActualButton</button>
<input class="os" type="reset">
<input class="os" type="submit">
<input class="os" type="button" value="InputTypeButton">
<button class="os">ActualButton</button>
</body>
</html>

View file

@ -0,0 +1,52 @@
<!DOCTYPE html>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<html>
<head>
<style>
div.button {
display: inline-block;
width: 80px;
border: 0;
padding: 0;
font: 10px sans-serif;
text-align: center;
vertical-align: top;
color: black;
background: gray;
}
div.p80 {
background: pink;
}
div.p100 {
background: yellow;
}
</style>
</head>
<body>
<!--Button has explicit height for us to resolve against: -->
<div class="button" style="height: 100px">
<div class="p80" style="margin-top: 10px; height: 80px">abc</div>
</div>
<div class="button" style="height: 100px">
<div class="p100" style="height: 100px">abc</div>
</div>
<!--Button is using intrinsic height: -->
<div class="button">
<div class="p80">abc</div>
</div>
<div class="button">
<div class="p100">abc</div>
</div>
</body>
</html>

View file

@ -0,0 +1,60 @@
<!DOCTYPE html>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<!-- This test verifies that we honor percent heights on content inside of
a <button> element (resolving the percent against the <button>).
(In this testcase, the button has no focus-border/padding.) -->
<html>
<head>
<style>
button {
width: 80px;
border: 0;
padding: 0;
font: 10px sans-serif;
vertical-align: top;
color: black;
background: gray;
-moz-appearance: none;
}
button::-moz-focus-inner {
padding: 0;
border: 0;
}
div.p80 {
height: 80%;
background: pink;
}
div.p100 {
height: 100%;
background: yellow;
}
</style>
</head>
<body>
<!--Button has explicit height for us to resolve against: -->
<button style="height: 100px">
<div class="p80">abc</div>
</button>
<button style="height: 100px">
<div class="p100">abc</div>
</button>
<!--Button is using intrinsic height: -->
<button>
<div class="p80">abc</div>
</button>
<button>
<div class="p100">abc</div>
</button>
</body>
</html>

View file

@ -0,0 +1,54 @@
<!DOCTYPE html>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<html>
<head>
<style>
div.button {
display: inline-block;
width: 78px;
border: 0;
/* Padding to match the -moz-focus-inner border/padding in testcase: */
padding: 7px 1px 3px;
font: 10px sans-serif;
text-align: center;
vertical-align: top;
color: black;
background: gray;
}
div.p80 {
background: pink;
}
div.p100 {
background: yellow;
}
</style>
</head>
<body>
<!--Button has explicit height for us to resolve against: -->
<div class="button" style="height: 100px">
<div class="p80" style="margin-top: 10px; height: 80px">abc</div>
</div>
<div class="button" style="height: 100px">
<div class="p100" style="height: 100px">abc</div>
</div>
<!--Button is using intrinsic height: -->
<div class="button">
<div class="p80">abc</div>
</div>
<div class="button">
<div class="p100">abc</div>
</div>
</body>
</html>

View file

@ -0,0 +1,63 @@
<!DOCTYPE html>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<!-- This test verifies that we honor percent heights on content inside of
a <button> element (resolving the percent against the <button>).
(In this testcase, the button has some focus-border/padding, which
occupies part of the button's content-box and which we'll have to
subtract out from the button's size before using it to resolve
percentages sizes.) -->
<html>
<head>
<style>
button {
width: 80px;
border: 0;
padding: 0;
font: 10px sans-serif;
vertical-align: top;
color: black;
background: gray;
-moz-appearance: none;
}
button::-moz-focus-inner {
padding: 6px 0 2px;
border: 1px dotted transparent;
}
div.p80 {
height: 80%;
background: pink;
}
div.p100 {
height: 100%;
background: yellow;
}
</style>
</head>
<body>
<!--Button has explicit height for us to resolve against: -->
<button style="height: 110px">
<div class="p80">abc</div>
</button>
<button style="height: 110px">
<div class="p100">abc</div>
</button>
<!--Button is using intrinsic height: -->
<button>
<div class="p80">abc</div>
</button>
<button>
<div class="p100">abc</div>
</button>
</body>
</html>

View file

@ -0,0 +1,53 @@
<!DOCTYPE html>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<html>
<head>
<style>
div.button {
display: inline-block;
border: 0;
padding: 0;
font: 10px sans-serif;
text-align: center;
vertical-align: top;
color: black;
background: gray;
}
div.p80 {
width: 80%;
background: pink;
}
div.p100 {
width: 100%;
background: yellow;
}
</style>
</head>
<body>
<!--Button has explicit width for us to resolve against: -->
<div class="button" style="width: 100px">
<div class="p80">abc</div>
</div>
<div class="button" style="width: 100px">
<div class="p100">abc</div>
</div>
<!--Button is using intrinsic width: -->
<div class="button">
<div class="p80">abc</div>
</div>
<div class="button">
<div class="p100">abc</div>
</div>
</body>
</html>

View file

@ -0,0 +1,59 @@
<!DOCTYPE html>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<!-- This test verifies that we honor percent widths on content inside of
a <button> element (resolving the percent against the <button>).
(In this testcase, the button has no focus-border/padding.) -->
<html>
<head>
<style>
button {
border: 0;
padding: 0;
font: 10px sans-serif;
vertical-align: top;
color: black;
background: gray;
-moz-appearance: none;
}
button::-moz-focus-inner {
padding: 0;
border: 0;
}
div.p80 {
width: 80%;
background: pink;
}
div.p100 {
width: 100%;
background: yellow;
}
</style>
</head>
<body>
<!--Button has explicit width for us to resolve against: -->
<button style="width: 100px">
<div class="p80">abc</div>
</button>
<button style="width: 100px">
<div class="p100">abc</div>
</button>
<!--Button is using intrinsic width: -->
<button>
<div class="p80">abc</div>
</button>
<button>
<div class="p100">abc</div>
</button>
</body>
</html>

View file

@ -0,0 +1,55 @@
<!DOCTYPE html>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<html>
<head>
<style>
div.button {
display: inline-block;
border: 0;
/* Padding to match the -moz-focus-inner border/padding in testcase: */
padding: 1px 7px 1px 3px;
font: 10px sans-serif;
text-align: center;
vertical-align: top;
color: black;
background: gray;
}
div.p80 {
width: 80%;
background: pink;
}
div.p100 {
width: 100%;
background: yellow;
}
</style>
</head>
<body>
<!--Button has explicit width for us to resolve against: -->
<div class="button" style="width: 100px">
<div class="p80">abc</div>
</div>
<div class="button" style="width: 100px">
<div class="p100">abc</div>
</div>
<!--Button is using intrinsic width: -->
<div class="button">
<div class="p80">abc</div>
</div>
<div class="button">
<div class="p100">abc</div>
</div>
</body>
</html>

View file

@ -0,0 +1,62 @@
<!DOCTYPE html>
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<!-- This test verifies that we honor percent widths on content inside of
a <button> element (resolving the percent against the <button>).
(In this testcase, the button has some focus-border/padding, which
occupies part of the button's content-box and which we'll have to
subtract out from the button's size before using it to resolve
percentages sizes.) -->
<html>
<head>
<style>
button {
border: 0;
padding: 0;
font: 10px sans-serif;
vertical-align: top;
color: black;
background: gray;
-moz-appearance: none;
}
button::-moz-focus-inner {
padding: 0 6px 0 2px;
border: 1px dotted transparent;
}
div.p80 {
width: 80%;
background: pink;
}
div.p100 {
width: 100%;
background: yellow;
}
</style>
</head>
<body>
<!--Button has explicit width for us to resolve against: -->
<button style="width: 110px">
<div class="p80">abc</div>
</button>
<button style="width: 110px">
<div class="p100">abc</div>
</button>
<!--Button is using intrinsic width: -->
<button>
<div class="p80">abc</div>
</button>
<button>
<div class="p100">abc</div>
</button>
</body>
</html>

View file

@ -0,0 +1,61 @@
# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing
== first-letter-1.html first-letter-1.html
== first-letter-1.html first-letter-1.html
== focus-area-percent-units-1.html focus-area-percent-units-1.html
== focus-area-percent-units-2.html focus-area-percent-units-2.html
== max-height.html max-height.html
== min-height.html min-height.html
== overflow-areas-1.html overflow-areas-1.html
# The buttons in these tests have some fancy shading applied to their corners
# on B2G, despite their "-moz-appearance: none; background: gray", so they
# don't quite match the reference case's normal <div>. That's why they're fuzzy.
fuzzy-if(B2G||Mulet||Android,125,20) == percent-height-child-1.html percent-height-child-1.html
# Initial mulet triage: parity with B2G/B2G Desktop
pref(browser.display.focus_ring_width,1) fuzzy-if(B2G||Mulet||Android,125,80) == percent-height-child-2.html percent-height-child-2.html
# Initial mulet triage: parity with B2G/B2G Desktop
fuzzy-if(B2G||Mulet||Android,125,20) == percent-width-child-1.html percent-width-child-1.html
# Initial mulet triage: parity with B2G/B2G Desktop
pref(browser.display.focus_ring_width,1) fuzzy-if(B2G||Mulet||Android,125,80) == percent-width-child-2.html percent-width-child-2.html
# Initial mulet triage: parity with B2G/B2G Desktop
== vertical-centering.html vertical-centering.html
== line-height-button-0.5.html line-height-button-0.5.html
== line-height-button-1.5.html line-height-button-1.5.html
== line-height-input-0.5.html line-height-input-0.5.html
== line-height-input-1.5.html line-height-input-1.5.html
# Looks like Android and B2G change the text color, but to something slightly
# different from ColorGray
fails-if(Android||B2G||Mulet) == disabled-1.html disabled-1.html
# Initial mulet triage: parity with B2G/B2G Desktop
== disabled-2.html disabled-2.html
== disabled-3.html disabled-3.html
== disabled-4.html disabled-4.html
== disabled-5.html disabled-5.html
== disabled-6.html disabled-6.html
fails-if(B2G||Mulet) == width-auto-size-em-ltr.html width-auto-size-em-ltr.html
# Bug 1145672
# Bug 1150486
fails-if(B2G||Mulet) == width-auto-size-ltr.html width-auto-size-ltr.html
# Bug 1145672
# Bug 1150486
== width-exact-fit-ltr.html width-exact-fit-ltr.html
== width-erode-part-focuspadding-ltr.html width-erode-part-focuspadding-ltr.html
== width-erode-all-focuspadding-ltr.html width-erode-all-focuspadding-ltr.html
== width-erode-overflow-focuspadding-ltr.html width-erode-overflow-focuspadding-ltr.html
fails-if(B2G||Mulet) == width-auto-size-em-rtl.html width-auto-size-em-rtl.html
# Bug 1145672
# Bug 1150486
fails-if(B2G||Mulet) == width-auto-size-rtl.html width-auto-size-rtl.html
# Bug 1145672
# Bug 1150486
== width-exact-fit-rtl.html width-exact-fit-rtl.html
== width-erode-part-focuspadding-rtl.html width-erode-part-focuspadding-rtl.html
== width-erode-all-focuspadding-rtl.html width-erode-all-focuspadding-rtl.html
== width-erode-overflow-focuspadding-rtl.html width-erode-overflow-focuspadding-rtl.html

View file

@ -0,0 +1,48 @@
== first-letter-1.html first-letter-1-ref.html
!= first-letter-1.html first-letter-1-noref.html
== focus-area-percent-units-1.html focus-area-percent-units-1-ref.html
== focus-area-percent-units-2.html focus-area-percent-units-2-ref.html
== max-height.html max-height-ref.html
== min-height.html min-height-ref.html
== overflow-areas-1.html overflow-areas-1-ref.html
# The buttons in these tests have some fancy shading applied to their corners
# on Android, despite their "-moz-appearance: none; background: gray", so they
# don't quite match the reference case's normal <div>. That's why they're fuzzy.
fuzzy-if(Android,125,20) == percent-height-child-1.html percent-height-child-1-ref.html
pref(browser.display.focus_ring_width,1) fuzzy-if(Android,125,80) == percent-height-child-2.html percent-height-child-2-ref.html
fuzzy-if(Android,125,20) == percent-width-child-1.html percent-width-child-1-ref.html
pref(browser.display.focus_ring_width,1) fuzzy-if(Android,125,80) == percent-width-child-2.html percent-width-child-2-ref.html
== vertical-centering.html vertical-centering-ref.html
!= line-height-button-0.5.html line-height-button-1.0.html
!= line-height-button-1.5.html line-height-button-1.0.html
!= line-height-input-0.5.html line-height-input-1.0.html
!= line-height-input-1.5.html line-height-input-1.0.html
# Looks like Android changes the text color, but to something slightly
# different from ColorGray
fails-if(Android) == disabled-1.html disabled-1-ref.html
== disabled-2.html disabled-2-ref.html
!= disabled-3.html disabled-3-notref.html
!= disabled-4.html disabled-4-notref.html
!= disabled-5.html disabled-5-notref.html
!= disabled-6.html disabled-6-notref.html
== width-auto-size-em-ltr.html width-auto-size-em-ltr-ref.html
== width-auto-size-ltr.html width-auto-size-ltr-ref.html
== width-exact-fit-ltr.html width-auto-size-ltr-ref.html
== width-erode-part-focuspadding-ltr.html width-erode-part-focuspadding-ltr-ref.html
== width-erode-all-focuspadding-ltr.html width-erode-all-focuspadding-ltr-ref.html
== width-erode-overflow-focuspadding-ltr.html width-erode-overflow-focuspadding-ltr-ref.html
== width-auto-size-em-rtl.html width-auto-size-em-rtl-ref.html
== width-auto-size-rtl.html width-auto-size-rtl-ref.html
== width-exact-fit-rtl.html width-auto-size-rtl-ref.html
== width-erode-part-focuspadding-rtl.html width-erode-part-focuspadding-rtl-ref.html
== width-erode-all-focuspadding-rtl.html width-erode-all-focuspadding-rtl-ref.html
== width-erode-overflow-focuspadding-rtl.html width-erode-overflow-focuspadding-rtl-ref.html
== display-grid-flex-columnset.html display-grid-flex-columnset-ref.html

View file

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<style>
div {
height: 100px;
display: inline-block;
border: 0;
padding: 0;
font: 2em/100px sans-serif;
text-align: center;
background: transparent;
color: black;
}
</style>
</head>
<body>
<div>button</div>
<div>button</div>
</body>
</html>

View file

@ -0,0 +1,33 @@
<!DOCTYPE html>
<html>
<head>
<style>
input, div {
height: 100px;
display: inline-block;
border: 0;
padding: 0;
font: 2em sans-serif;
background: transparent;
color: black;
}
input {
-moz-appearance: none;
}
input::-moz-focus-inner {
padding: 0;
border: 0;
}
div {
line-height: 100px;
text-align: center;
}
</style>
</head>
<body>
<input type='button' value='button' />
<div>button</div>
</body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE HTML>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
}
span {
display: inline-block; vertical-align: middle;
height: 2em; width: 5em; border: 2px solid blue;
margin: 1px 3px; /* for implicit focuspadding */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,20 @@
<!DOCTYPE HTML>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 1em;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 2em; width: 5em; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,20 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
}
span {
display: inline-block; vertical-align: middle;
height: 2em; width: 5em; border: 2px solid blue;
margin: 1px 3px; /* for implicit focuspadding */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 1em;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 2em; width: 5em; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,20 @@
<!DOCTYPE HTML>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
margin: 1px 3px; /* for implicit focuspadding */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,20 @@
<!DOCTYPE HTML>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 2em; width: 5em; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
margin: 1px 3px; /* for implicit focuspadding */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 2em; width: 5em; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,20 @@
<!DOCTYPE HTML>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
margin: 1px 0px; /* for implicit focuspadding, fully eroded */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
width: 62px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
margin: 1px 0px; /* for implicit focuspadding, fully eroded */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
width: 62px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,20 @@
<!DOCTYPE HTML>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
margin: 1px -2px 1px 0; /* for implicit focuspadding, fully eroded and overflowed */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
width: 60px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
margin: 1px 0 1px -2px; /* for implicit focuspadding, fully eroded and overflowed */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
width: 60px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,20 @@
<!DOCTYPE HTML>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
margin: 1px 2px; /* for implicit focuspadding, partly eroded */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
width: 66px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
div.button {
display: inline-block;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
margin: 1px 2px; /* for implicit focuspadding, partly eroded */
}
</style>
<div class=button><span></span></div>

View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
width: 66px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
width: 68px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<html dir=rtl>
<style>
button {
-moz-appearance: none;
background: yellow;
border: 2px solid fuchsia;
padding: 2px;
font-size: 10px;
width: 68px;
border-radius: 0; /* override mobile/android/themes/core/content.css */
}
span {
display: inline-block; vertical-align: middle;
height: 20px; width: 50px; border: 2px solid blue;
}
</style>
<button><span></span></button>

View file

@ -0,0 +1,79 @@
<!DOCTYPE HTML>
<html><head>
<meta charset="utf-8">
<title>Testcase for bug 971653</title>
<style type="text/css">
html,body {
color:black; background-color:white; font-size:16px; padding:0; margin:0;
}
div {
position: absolute;
background: rgba(0,255,0,0.5);
top:0; bottom:0;
left:0; right:0;
z-index: 0;
}
c {
display: block;
background: blue;
height:100%;
}
legend { height: 24px; }
fieldset {
position: absolute;
border: 2px green solid;
width: 100px;
height: 100px;
margin-bottom:40px;
}
#t1,#t3 { padding: 3px 5px 7px 11px; }
#t2,#t4 { padding: 0; }
#t1 div, #t3 div {
/* same numbers as padding above */
left: -11px; right: -5px;
top: -3px; bottom:-7px;
}
#t2 { top: 120px; }
#t3 { top: 240px; }
#t4 { top: 360px; }
x {
position: absolute;
width:100px;
height:100px;
}
#t1 x, #t2 x {
height:78px; /* compensate for legend */
}
</style>
</head>
<body>
<fieldset id="t1">
<legend>legend</legend>
<x><div></div><c></c></x>
</fieldset>
<fieldset id="t2">
<legend>legend</legend>
<x><div></div></x>
</fieldset>
<fieldset id="t3">
<x><div></div><c></c></x>
</fieldset>
<fieldset id="t4">
<x><div></div></x>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,64 @@
<!DOCTYPE HTML>
<html><head>
<meta charset="utf-8">
<title>Testcase for bug 971653</title>
<style type="text/css">
html,body {
color:black; background-color:white; font-size:16px; padding:0; margin:0;
}
div {
position: absolute;
background: rgba(0,255,0,0.5);
top:0; bottom:0;
left:0; right:0;
z-index: 0;
}
c {
display: block;
background: blue;
height:100%;
}
legend { height: 24px; }
fieldset {
position: absolute;
border: 2px green solid;
width: 100px;
height: 100px;
margin-bottom:40px;
}
#t1,#t3 { padding: 3px 5px 7px 11px; }
#t2,#t4 { padding: 0; }
#t2 { top: 120px; }
#t3 { top: 240px; }
#t4 { top: 360px; }
</style>
</head>
<body>
<fieldset id="t1">
<legend>legend</legend>
<div></div><c></c>
</fieldset>
<fieldset id="t2">
<legend>legend</legend>
<div></div>
</fieldset>
<fieldset id="t3">
<div></div><c></c>
</fieldset>
<fieldset id="t4">
<div></div>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,24 @@
<!DOCTYPE HTML>
<html>
<head>
<style>
fieldset {
background:pink;
overflow:hidden;
height:100px;
}
legend::after { content:"legend"; }
p {
background:lime;
height:20px;
}
</style>
</head>
<body>
<fieldset id="f1"><legend></legend><p></p></fieldset>
<br>
<fieldset id="f2"><legend></legend><p></p></fieldset>
<br>
<fieldset id="f3"><legend></legend></fieldset>
</body>
</html>

View file

@ -0,0 +1,33 @@
<!DOCTYPE HTML>
<html class="reftest-wait">
<head>
<style>
fieldset {
background:pink;
overflow:hidden;
height:100px;
}
legend::after { content:"legend"; }
p {
background:lime;
height:20px;
}
</style>
</head>
<body>
<fieldset id="f1"><p></p></fieldset>
<br>
<fieldset id="f2"><p></p></fieldset>
<br>
<fieldset id="f3"></fieldset>
<script>
function doTest() {
f1.appendChild(document.createElement('legend'));
f2.insertBefore(document.createElement('legend'), f2.firstChild);
f3.appendChild(document.createElement('legend'));
document.documentElement.removeAttribute("class");
}
window.addEventListener("MozReftestInvalidate", doTest);
</script>
</body>
</html>

View file

@ -0,0 +1,40 @@
<!DOCTYPE HTML>
<html>
<body>
<style>
p { flex-grow: 1; }
</style>
<fieldset style="overflow:hidden; width:200px; height:200px;">
<legend>Legend</legend>
<div style="display:flex;">
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
</div>
</fieldset>
<fieldset>
<legend>Legend</legend>
<div style="display:flex;">
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
</div>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,36 @@
<!DOCTYPE HTML>
<html>
<body>
<style>
p { flex-grow: 1; }
</style>
<fieldset style="display:flex; overflow:hidden; width:200px; height:200px;">
<legend>Legend</legend>
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
</fieldset>
<fieldset style="display:flex;">
<legend>Legend</legend>
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
</fieldset>
</body>
</html>

View file

@ -0,0 +1,33 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="overflow:hidden; width:200px; height:200px;">
<legend>Legend</legend>
<div style="display:grid; grid-template-columns: repeat(4,50px); grid-auto-rows: 20px;">
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
</div>
</fieldset>
<fieldset>
<legend>Legend</legend>
<div style="display:grid; grid-auto-columns: 50px; grid-auto-rows: 20px;">
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
</div>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,29 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="display:grid; overflow:hidden; grid-template-columns: repeat(4,50px); grid-auto-rows: 20px; width:200px; height:200px;">
<legend>Legend</legend>
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
</fieldset>
<fieldset style="display:grid; grid-auto-columns: 50px; grid-auto-rows: 20px;">
<legend>Legend</legend>
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
<p>X
</fieldset>
</body>
</html>

View file

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="width:200px; height:200px; padding:0">
<legend>Legend</legend>
<div style="overflow:hidden; height:100%;">
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
</div>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="overflow:hidden; width:200px; height:200px; padding:0">
<legend>Legend</legend>
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
</fieldset>
</body>
</html>

View file

@ -0,0 +1,8 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="width:0; padding:0;">
<div style="width:400px; height:200px;"></div>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,8 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="padding:50px; float:left;">
<div style="width:300px; height:100px;"></div>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,52 @@
<!DOCTYPE HTML>
<html><head>
<meta charset="utf-8">
<title>Testcase for bug 261037</title>
<style type="text/css">
fieldset, div {
background:pink;
overflow:auto;
height:100px;
margin:0; padding:0; border:0;
}
p {
background:blue;
height:100px;
margin:0; padding:0;
}
.overflow {
height:110px;
}
.abs {
position:absolute;
width:100px;
top:250px;
}
p.abs {
top:0;left:0;
}
.b { border:10px solid black; }
.p { padding: 7px 0; }
.p p { height:114px; }
</style>
</head>
<body>
<div><p></p></div>
<br>
<div><p class="overflow"></p></div>
<br>
<div class="abs"><p class="abs"></p></div>
<br>
<div class="abs" style="left:120px"><p class="abs overflow"></p></div>
<br>
<div class="abs b" style="left:240px"><p class="abs"></p></div>
<br>
<div class="abs b" style="left:370px"><p class="abs overflow"></p></div>
<br>
<div class="abs b p" style="left:510px"><p class="abs"></p></div>
<br>
<div class="abs b p" style="left:640px"><p class="abs overflow"></p></div>
</body>
</html>

View file

@ -0,0 +1,52 @@
<!DOCTYPE HTML>
<html><head>
<meta charset="utf-8">
<title>Testcase for bug 261037</title>
<style type="text/css">
fieldset, div {
background:pink;
overflow:auto;
height:100px;
margin:0; padding:0; border:0;
}
p {
background:blue;
height:100px;
margin:0; padding:0;
}
.overflow {
height:110px;
}
.abs {
position:absolute;
width:100px;
top:250px;
}
p.abs {
top:0;left:0;
}
.b { border:10px solid black; }
.p { padding: 7px 0; }
.p p { height:114px; }
</style>
</head>
<body>
<fieldset><p></p></fieldset>
<br>
<fieldset><p class="overflow"></p></fieldset>
<br>
<fieldset class="abs"><p class="abs"></p></fieldset>
<br>
<fieldset class="abs" style="left:120px"><p class="abs overflow"></p></fieldset>
<br>
<fieldset class="abs b" style="left:240px"><p class="abs"></p></fieldset>
<br>
<fieldset class="abs b" style="left:370px"><p class="abs overflow"></p></fieldset>
<br>
<fieldset class="abs b p" style="left:510px"><p class="abs"></p></fieldset>
<br>
<fieldset class="abs b p" style="left:640px"><p class="abs overflow"></p></fieldset>
</body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE HTML>
<html>
<body>
<div style="width:700px; border:2px solid green; overflow:hidden">
<fieldset style="padding:140px; width:400px;">
<legend>Legend</legend>
TextTextTextTextTextText
</fieldset>
<fieldset style="padding:140px; display:inline;">
<legend>Legend</legend>
TextTextTextTextTextText
</fieldset>
<fieldset style="padding:140px; float:left;">
<legend>Legend</legend>
TextTextTextTextTextText
</fieldset>
</div>
</body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE HTML>
<html>
<body>
<div style="width:700px; border:2px solid green; overflow:hidden">
<fieldset style="padding:20%; width:400px;">
<legend>Legend</legend>
TextTextTextTextTextText
</fieldset>
<fieldset style="padding:20%; display:inline;">
<legend>Legend</legend>
TextTextTextTextTextText
</fieldset>
<fieldset style="padding:20%; float:left;">
<legend>Legend</legend>
TextTextTextTextTextText
</fieldset>
</div>
</body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="width:200px; height:200px; padding:0">
<legend>Legend</legend>
<div style="overflow:scroll; height:100%">
</fieldset>
</body>
</html>

View file

@ -0,0 +1,8 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="overflow:scroll; width:200px; height:200px; padding:0">
<legend>Legend</legend>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,24 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="width:200px; height:200px; padding:0">
<legend style="overflow:hidden">Legend</legend>
<div id="d" style="overflow:hidden; height:100%;">
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
</div>
</fieldset>
<script>
d.scrollTop = 20;
</script>
</body>
</html>

View file

@ -0,0 +1,27 @@
<!DOCTYPE HTML>
<html class="reftest-wait">
<body>
<fieldset id="f" style="overflow:hidden; width:200px; height:200px; padding:0">
<legend style="overflow:hidden">Legend</legend>
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
<p>Hello Kitty
</fieldset>
<script>
f.scrollTop = 0;
function doTest() {
f.scrollTop = 20;
document.documentElement.removeAttribute("class");
}
window.addEventListener("MozReftestInvalidate", doTest);
</script>
</body>
</html>

View file

@ -0,0 +1,5 @@
<!DOCTYPE html>
<html>
<fieldset><legend style="position:relative;left:20px;">Legend</legend></fieldset>
<fieldset dir="rtl"><legend style="position:relative;right:20px;">Legend</legend></fieldset>
</html>

View file

@ -0,0 +1,5 @@
<!DOCTYPE html>
<html>
<fieldset><legend dir="rtl" style="position:relative;left:20px;">Legend</legend></fieldset>
<fieldset dir="rtl"><legend dir="ltr" style="position:relative;right:20px;">Legend</legend></fieldset>
</html>

View file

@ -0,0 +1,175 @@
<!DOCTYPE HTML>
<html><head>
<meta charset="utf-8">
<title>Testcase for bug 971933</title>
<style type="text/css">
html,body {
color:black; background-color:white; font-size:16px;
}
#f0 div::before { content: "f0"; }
#f1 div::before { content: "f1"; }
#f2 div::before { content: "f2"; }
#f3 div::before { content: "f3"; }
#f4 div::before { content: "f4"; }
#f5 div::before { content: "f5"; }
#f6 div::before { content: "f6"; }
#f7 div::before { content: "f7"; }
#f8 div::before { content: "f8"; }
#f9 div::before { content: "f9"; }
legend { background:pink; height:30px; }
div { background:yellow; height:100px; overflow:hidden; }
fieldset {
border-width:0;
padding:0;
margin:0;
margin-top:6px;
outline:1px dotted black;
height:auto;
background:grey;
padding-bottom:0px;
padding-top:5px;
border:1px solid blue;
border-top-width:7px;
}
#f1 { }
#f2 { border-top-width:0; }
#f3 { border-width:0; }
#f4 { border-bottom-width:0; }
#f5 { border-width:0; padding:0; }
#f6 { border-width:0; padding-bottom:0; }
#f7 { border-width:0; padding-top:0; }
#f8 { padding-top:0; }
#f9 { padding-bottom:0; }
#f0 { padding:0; }
#c2 fieldset { height:29px; }
#c3 fieldset { height:39px; }
#c4 fieldset { height:29px; }
#c4 legend { height: 20px; }
#c5 legend { height:21px; }
#c5 fieldset { border-top-width:31px; }
.col { float:left; width:10ch; margin-left:6px; }
#c1 div { height:3px; } #c1 #f6 div, #c1 #f9 div, #c1 #f0 div { height:0; }
#c1 #f5 div { height:0px; }
#c2 div { height:9px; }
#c2 #f1 { padding-bottom:3px; } #c2 #f1 div { height:9px;}
#c2 #f2 { padding-bottom:3px; } #c2 #f2 div { height:3px; }
#c2 #f3 { padding-bottom:3px; } #c2 #f3 div { height:3px; }
#c2 #f4 { padding-bottom:3px; }
#c2 #f5 div { height:0; }
#c2 #f6 div { height:0; }
#c2 #f7 { padding-bottom:3px; } #c2 #f7 div { height:3px; }
#c2 #f8 { padding-bottom:3px; } #c2 #f8 div { height:9px; }
#c2 #f9 div { height:6px; }
#c2 #f0 div { height:6px; }
#c3 fieldset { padding-bottom:3px; }
#c3 #f1 div { height:19px; }
#c3 #f2 div { height:12px; }
#c3 #f3 div { height:12px; }
#c3 #f4 div { height:19px; }
#c3 #f5 { padding-bottom:0; } #c3 #f5 div { height:9px; }
#c3 #f6 { padding-bottom:0; } #c3 #f6 div { height:9px; }
#c3 #f7 div { height:12px; }
#c3 #f8 div { height:19px; }
#c3 #f9 { padding-bottom:0; } #c3 #f9 div { height:16px; }
#c3 #f0 { padding-bottom:0; } #c3 #f0 div { height:16px; }
#c4 fieldset { padding-bottom:3px; }
#c4 #f1 div { height:19px; }
#c4 #f2 div { height:12px; }
#c4 #f3 div { height:12px; }
#c4 #f4 div { height:19px; }
#c4 #f5 { padding-bottom:0; } #c4 #f5 div { height:9px; }
#c4 #f6 { padding-bottom:0; } #c4 #f6 div { height:9px; }
#c4 #f7 div { height:12px; }
#c4 #f8 div { height:19px; }
#c4 #f9 { padding-bottom:0; } #c4 #f9 div { height:16px; }
#c4 #f0 { padding-bottom:0; } #c4 #f0 div { height:16px; }
#c5 #f1 div { height:18px; }
#c5 #f2 div { height:18px; }
#c5 #f3 div { height:18px; }
#c5 #f4 div { height:18px; }
#c5 #f5 div { height:15px; }
#c5 #f6 div { height:15px; }
#c5 #f7 div { height:18px; }
#c5 #f8 div { height:18px; }
#c5 #f9 div { height:15px; }
#c5 #f0 div { height:15px; }
</style>
</head>
<body>
<span id=c1 class=col>C1
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
<span id=c2 class=col>C2
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
<span id=c3 class=col>C3
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
<span id=c4 class=col>C4
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
<span id=c5 class=col>C5
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
</body>
</html>

View file

@ -0,0 +1,125 @@
<!DOCTYPE HTML>
<html><head>
<meta charset="utf-8">
<title>Testcase for bug 971933</title>
<style type="text/css">
html,body {
color:black; background-color:white; font-size:16px;
}
#f0 div::before { content: "f0"; }
#f1 div::before { content: "f1"; }
#f2 div::before { content: "f2"; }
#f3 div::before { content: "f3"; }
#f4 div::before { content: "f4"; }
#f5 div::before { content: "f5"; }
#f6 div::before { content: "f6"; }
#f7 div::before { content: "f7"; }
#f8 div::before { content: "f8"; }
#f9 div::before { content: "f9"; }
legend { background:pink; height:30px; }
div { background:yellow; height:100px; }
fieldset {
border-width:0;
padding:0;
margin:0;
margin-top:6px;
outline:1px dotted black;
height:15px;
overflow:hidden;
background:grey;
padding-bottom:3px;
padding-top:5px;
border:1px solid blue;
border-top-width:7px;
}
#f1 {}
#f2 { border-top-width:0; }
#f3 { border-width:0; }
#f4 { border-bottom-width:0; }
#f5 { border-width:0; padding:0; }
#f6 { border-width:0; padding-bottom:0; }
#f7 { border-width:0; padding-top:0; }
#f8 { padding-top:0; }
#f9 { padding-bottom:0; }
#f0 { padding:0; }
#c2 fieldset { height:29px; }
#c3 fieldset { height:39px; }
#c4 fieldset { height:29px; }
#c4 legend { height: 20px; }
#c5 legend { height:21px; }
#c5 fieldset { border-top-width:31px; }
.col { float:left; width:10ch; margin-left:6px; }
</style>
</head>
<body>
<span id=c1 class=col>C1
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
<span id=c2 class=col>C2
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
<span id=c3 class=col>C3
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
<span id=c4 class=col>C4
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
<span id=c5 class=col>C5
<fieldset id=f1><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f2><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f3><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f4><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f5><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f6><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f7><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f8><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f9><legend>LEGEND</legend><div></div></fieldset>
<fieldset id=f0><legend>LEGEND</legend><div></div></fieldset>
</span>
</body>
</html>

View file

@ -0,0 +1,11 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="position:relative; overflow:hidden; width:500px; height:500px;">
<legend>Legend</legend>
<div style="height:1000px;">
<div style="position:absolute; padding:2px; left:20px; top:20px; background:yellow;">Abs-pos</div>
</div>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,14 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset id="f" style="position:relative; overflow:hidden; width:500px; height:500px;">
<legend>Legend</legend>
<div style="height:1000px;">
<div style="position:absolute; padding:2px; left:20px; top:50px; background:yellow;">Abs-pos</div>
</div>
</fieldset>
<script>
f.scrollTop = 30;
</script>
</body>
</html>

View file

@ -0,0 +1,19 @@
# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing
fuzzy-if(skiaContent,2,13) == dynamic-legend-scroll-1.html dynamic-legend-scroll-1.html
== fieldset-hidden-1.html fieldset-hidden-1.html
== fieldset-intrinsic-width-1.html fieldset-intrinsic-width-1.html
== fieldset-percentage-padding-1.html fieldset-percentage-padding-1.html
== fieldset-scroll-1.html fieldset-scroll-1.html
== fieldset-scrolled-1.html fieldset-scrolled-1.html
random-if(B2G||Mulet) == fieldset-overflow-auto-1.html fieldset-overflow-auto-1.html
# Initial mulet triage: parity with B2G/B2G Desktop
fuzzy-if(winWidget&&!layersGPUAccelerated,121,221) == positioned-container-1.html positioned-container-1.html
== relpos-legend-1.html relpos-legend-1.html
== relpos-legend-2.html relpos-legend-2.html
skip-if((B2G&&browserIsRemote)||Mulet) == sticky-legend-1.html sticky-legend-1.html
# Initial mulet triage: parity with B2G/B2G Desktop
fails fuzzy-if(skiaContent,1,40768) == abs-pos-child-sizing.html abs-pos-child-sizing.html
== overflow-hidden.html overflow-hidden.html
== legend-rtl.html legend-rtl.html
== fieldset-grid-001.html fieldset-grid-001.html
== fieldset-flexbox-001.html fieldset-flexbox-001.html

View file

@ -0,0 +1,16 @@
fuzzy-if(skiaContent,2,13) == dynamic-legend-scroll-1.html dynamic-legend-scroll-1-ref.html
== fieldset-hidden-1.html fieldset-hidden-1-ref.html
== fieldset-intrinsic-width-1.html fieldset-intrinsic-width-1-ref.html
== fieldset-percentage-padding-1.html fieldset-percentage-padding-1-ref.html
== fieldset-scroll-1.html fieldset-scroll-1-ref.html
== fieldset-scrolled-1.html fieldset-scrolled-1-ref.html
== fieldset-overflow-auto-1.html fieldset-overflow-auto-1-ref.html
fuzzy-if(winWidget&&!layersGPUAccelerated,140,276) == positioned-container-1.html positioned-container-1-ref.html
== relpos-legend-1.html relpos-legend-1-ref.html
== relpos-legend-2.html relpos-legend-2-ref.html
== sticky-legend-1.html sticky-legend-1-ref.html
fuzzy-if(skiaContent,1,40768) == abs-pos-child-sizing.html abs-pos-child-sizing-ref.html
== overflow-hidden.html overflow-hidden-ref.html
== legend-rtl.html legend-rtl-ref.html
== fieldset-grid-001.html fieldset-grid-001-ref.html
== fieldset-flexbox-001.html fieldset-flexbox-001-ref.html

View file

@ -0,0 +1,8 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset>
<legend><div style="position:relative; top:20px">Legend</div></legend>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,8 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset>
<legend style="position:relative; top:20px">Legend</legend>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,8 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset>
<legend><span style="position:relative; top:20px">Legend</span></legend>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,8 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset>
<legend style="display:inline; position:relative; top:20px">Legend</legend>
</fieldset>
</body>
</html>

View file

@ -0,0 +1,12 @@
<!DOCTYPE HTML>
<html>
<body>
<fieldset style="overflow:hidden; height:300px;">
<legend style="position:fixed; top:0"><div style="width:200px; height:50px; background:yellow;"></div></legend>
</fieldset>
<div style="height:5000px;"></div>
<script>
window.scrollTo(0,100);
</script>
</body>
</html>

Some files were not shown because too many files have changed in this diff Show more