diff options
| author | Matt A. Tobin <mattatobin@localhost.localdomain> | 2018-02-02 04:16:08 -0500 |
|---|---|---|
| committer | Matt A. Tobin <mattatobin@localhost.localdomain> | 2018-02-02 04:16:08 -0500 |
| commit | 5f8de423f190bbb79a62f804151bc24824fa32d8 (patch) | |
| tree | 10027f336435511475e392454359edea8e25895d /layout/reftests/margin-collapsing | |
| parent | 49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff) | |
| download | UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip | |
Add m-esr52 at 52.6.0
Diffstat (limited to 'layout/reftests/margin-collapsing')
755 files changed, 23255 insertions, 0 deletions
diff --git a/layout/reftests/margin-collapsing/block-abs-pos-1-dyn.html b/layout/reftests/margin-collapsing/block-abs-pos-1-dyn.html new file mode 100644 index 000000000..d71584e2d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-abs-pos-1-dyn.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<!-- Note: CSS 2.1 allows guessing the static position of an absolutely + positioned element whose offsets are 'auto' (initial value), i.e. + the reference of this test is just one of many possible outcomes. + See http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width --> +<style type="text/css"> +#in-flow-top { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +#abs-pos { + width: 20px; height: 20px; + background-color: blue; + margin-top: 10px; + margin-bottom: 10px; +} +#in-flow-bottom { + height: 20px; + margin-top: 20px; + background-color: lightgreen; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('abs-pos').style.position = 'absolute'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="in-flow-top"></div> +<div id="abs-pos"></div> +<div id="in-flow-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-abs-pos-1-ref.html b/layout/reftests/margin-collapsing/block-abs-pos-1-ref.html new file mode 100644 index 000000000..81f2c37ff --- /dev/null +++ b/layout/reftests/margin-collapsing/block-abs-pos-1-ref.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html> +<head> +<!-- Note: CSS 2.1 allows guessing the static position of an absolutely + positioned element whose offsets are 'auto' (initial value), i.e. + the reference of this test is just one of many possible outcomes. + See http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width --> +<style type="text/css"> +#in-flow-top { + height: 20px; + background-color: green; +} +#abs-pos { + width: 20px; height: 20px; + background-color: blue; + position: relative; + top: -10px; +} +#in-flow-bottom { + height: 20px; + background-color: lightgreen; +} +#spacer { + height: 20px; +} +</style> +</head> +<body> +<div id="in-flow-top"></div> +<div id="spacer"></div> +<div id="in-flow-bottom"></div> +<div id="abs-pos"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-abs-pos-1.html b/layout/reftests/margin-collapsing/block-abs-pos-1.html new file mode 100644 index 000000000..d398054c5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-abs-pos-1.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<!-- Note: CSS 2.1 allows guessing the static position of an absolutely + positioned element whose offsets are 'auto' (initial value), i.e. + the reference of this test is just one of many possible outcomes. + See http://www.w3.org/TR/CSS21/visudet.html#abs-non-replaced-width --> +<style type="text/css"> +#in-flow-top { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +#abs-pos { + position: absolute; + width: 20px; height: 20px; + background-color: blue; + margin-top: 10px; + margin-bottom: 10px; +} +#in-flow-bottom { + height: 20px; + margin-top: 20px; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="in-flow-top"></div> +<div id="abs-pos"></div> +<div id="in-flow-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-abs-pos-2-dyn.html b/layout/reftests/margin-collapsing/block-abs-pos-2-dyn.html new file mode 100644 index 000000000..e59e53e84 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-abs-pos-2-dyn.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<html> +<head> +<style type="text/css"> +#abs-pos { + top: 20px; left: 20px; + width: 200px; + background-color: lightgreen; +} +#in-flow-child { + height: 100px; + margin-top: 40px; + margin-bottom: 40px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('abs-pos').style.position = 'absolute'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="abs-pos"> + <div id="in-flow-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-abs-pos-2-ref.html b/layout/reftests/margin-collapsing/block-abs-pos-2-ref.html new file mode 100644 index 000000000..6fd7e241a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-abs-pos-2-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#abs-pos { + position: absolute; + top: 20px; left: 20px; + width: 200px; + padding: 40px 0; + background-color: lightgreen; +} +#in-flow-child { + height: 100px; + background-color: green; +} +</style> +</head> +<body> +<div id="abs-pos"> + <div id="in-flow-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-abs-pos-2-ref2.html b/layout/reftests/margin-collapsing/block-abs-pos-2-ref2.html new file mode 100644 index 000000000..f673e153f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-abs-pos-2-ref2.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 10px; +} +#abs-pos { + width: 200px; + background-color: lightgreen; +} +.margin { + height: 40px; +} +#content { + height: 100px; + background-color: green; +} +</style> +</head> +<body> +<div id="abs-pos"> + <div class="margin"></div> + <div id="content"></div> + <div class="margin"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-abs-pos-2.html b/layout/reftests/margin-collapsing/block-abs-pos-2.html new file mode 100644 index 000000000..294624bb4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-abs-pos-2.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#abs-pos { + position: absolute; + top: 20px; left: 20px; + width: 200px; + background-color: lightgreen; +} +#in-flow-child { + height: 100px; + margin-top: 40px; + margin-bottom: 40px; + background-color: green; +} +</style> +</head> +<body> +<div id="abs-pos"> + <div id="in-flow-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-1-ref.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-1-ref.html new file mode 100644 index 000000000..1d45fb547 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-1-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + height: 40px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-1a-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-1a-dyn.html new file mode 100644 index 000000000..697a3e585 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-1a-dyn.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 10px; +} +#last-child { + display: none; + margin-bottom: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-1a.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-1a.html new file mode 100644 index 000000000..d3497a10a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-1a.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 10px; +} +#last-child { + margin-bottom: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-1b-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-1b-dyn.html new file mode 100644 index 000000000..40f6f5092 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-1b-dyn.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +#last-child { + display: none; + margin-bottom: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-1b.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-1b.html new file mode 100644 index 000000000..8fdcd64a2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-1b.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +#last-child { + margin-bottom: 10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-1c-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-1c-dyn.html new file mode 100644 index 000000000..c38af922f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-1c-dyn.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +#last-child { + display: none; + margin-bottom: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-1c.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-1c.html new file mode 100644 index 000000000..c8e1e40ee --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-1c.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +#last-child { + margin-bottom: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-2-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-2-dyn.html new file mode 100644 index 000000000..75e3e7581 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-2-dyn.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 0; +} +#last-child { + margin-bottom: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.marginBottom = '-10px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-2-ref.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-2-ref.html new file mode 100644 index 000000000..7058f2b77 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-2-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + height: 30px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-2.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-2.html new file mode 100644 index 000000000..8aea2e127 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-2.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: -10px; +} +#last-child { + margin-bottom: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-3-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-3-dyn.html new file mode 100644 index 000000000..1e7557410 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-3-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child { + height: 20px; + margin-bottom: 20px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 0px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.marginBottom = '-20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-3-ref.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-3-ref.html new file mode 100644 index 000000000..9c38173e6 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-3-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 20px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-3.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-3.html new file mode 100644 index 000000000..024c6bb35 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-3.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 20px; + margin-bottom: 20px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: -20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-4-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-4-dyn.html new file mode 100644 index 000000000..827f2ce84 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-4-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<html> +<head> +<style type="text/css"> +#last-child { + height: 20px; + margin-bottom: 20px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 0px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.marginBottom = '-30px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-4-ref.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-4-ref.html new file mode 100644 index 000000000..643b84e90 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-4-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 10px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-4.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-4.html new file mode 100644 index 000000000..86aa36c60 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-4.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 20px; + margin-bottom: 20px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: -30px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-5-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-5-dyn.html new file mode 100644 index 000000000..586102166 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-5-dyn.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +#last-child { + margin-bottom: 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.marginBottom = '-10px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-5-ref.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-5-ref.html new file mode 100644 index 000000000..7058f2b77 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-5-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + height: 30px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-5.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-5.html new file mode 100644 index 000000000..48d597ea4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-5.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +#last-child { + margin-bottom: -10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-6-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-6-dyn.html new file mode 100644 index 000000000..6ac4c2a33 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-6-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child { + height: 20px; + margin-bottom: 0px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.marginBottom = '-20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-6-ref.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-6-ref.html new file mode 100644 index 000000000..9c38173e6 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-6-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 20px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-6.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-6.html new file mode 100644 index 000000000..5b82207d3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-6.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 20px; + margin-bottom: -20px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-7-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-7-dyn.html new file mode 100644 index 000000000..3e149c418 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-7-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<html> +<head> +<style type="text/css"> +#last-child { + height: 20px; + margin-bottom: 0px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.marginBottom = '-30px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-7-ref.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-7-ref.html new file mode 100644 index 000000000..643b84e90 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-7-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 10px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-7.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-7.html new file mode 100644 index 000000000..17af01b5a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-7.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 20px; + margin-bottom: -30px; + background-color: blue; +} +#separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-8-ref.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-8-ref.html new file mode 100644 index 000000000..963a1bca7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-8-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 20px; + background-color: blue; +} +#separator { + height: 40px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-8a-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-8a-dyn.html new file mode 100644 index 000000000..1e9ccc07c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-8a-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child { + display: none; + height: 40px; + margin-bottom: -20px; + background-color: blue; +} +#separator { + height: 40px; + background-color: green; +} +#parent { + margin-bottom: -10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-8a.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-8a.html new file mode 100644 index 000000000..33ad43809 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-8a.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 40px; + margin-bottom: -20px; + background-color: blue; +} +#separator { + height: 40px; + background-color: green; +} +#parent { + margin-bottom: -10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-8b-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-8b-dyn.html new file mode 100644 index 000000000..68a01ab39 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-8b-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child { + display: none; + height: 40px; + margin-bottom: -10px; + background-color: blue; +} +#separator { + height: 40px; + background-color: green; +} +#parent { + margin-bottom: -20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-8b.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-8b.html new file mode 100644 index 000000000..35c3895fd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-8b.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 40px; + margin-bottom: -10px; + background-color: blue; +} +#separator { + height: 40px; + background-color: green; +} +#parent { + margin-bottom: -20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-8c-dyn.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-8c-dyn.html new file mode 100644 index 000000000..2d95bb8c9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-8c-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#last-child { + display: none; + height: 40px; + margin-bottom: -20px; + background-color: blue; +} +#separator { + height: 40px; + background-color: green; +} +#parent { + margin-bottom: -20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-auto-height-last-child-8c.html b/layout/reftests/margin-collapsing/block-auto-height-last-child-8c.html new file mode 100644 index 000000000..d76c73234 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-auto-height-last-child-8c.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#last-child { + height: 40px; + margin-bottom: -20px; + background-color: blue; +} +#separator { + height: 40px; + background-color: green; +} +#parent { + margin-bottom: -20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-1a-ref.html b/layout/reftests/margin-collapsing/block-clear-1a-ref.html new file mode 100644 index 000000000..9eea35835 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-1a-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + margin-right: auto; + height: 40px; width: 100px; + background-color: green; + margin-bottom: 10px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-1a.html b/layout/reftests/margin-collapsing/block-clear-1a.html new file mode 100644 index 000000000..ca8cd7e66 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-1a.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + margin-bottom: 10px; +} +#float { + float: left; + height: 40px; width: 100px; + background-color: green; +} +#clear { + clear: left; + margin-top: 20px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-1b-ref.html b/layout/reftests/margin-collapsing/block-clear-1b-ref.html new file mode 100644 index 000000000..4029aa6f7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-1b-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + margin-left: auto; + height: 40px; width: 100px; + background-color: green; + margin-bottom: 10px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-1b.html b/layout/reftests/margin-collapsing/block-clear-1b.html new file mode 100644 index 000000000..d2ef1998e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-1b.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + margin-bottom: 10px; +} +#float { + float: right; + height: 40px; width: 100px; + background-color: green; +} +#clear { + clear: right; + margin-top: 20px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-2-noref.html b/layout/reftests/margin-collapsing/block-clear-2-noref.html new file mode 100644 index 000000000..ada1f22ff --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-2-noref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<!-- Without floats, no clearance applies, thus margin-top of #clear + should collapse with margin-bottom of its parent element. --> +<style type="text/css"> +.separator { + height: 20px; + margin-bottom: 30px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-2-ref.html b/layout/reftests/margin-collapsing/block-clear-2-ref.html new file mode 100644 index 000000000..ed572a6f9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-2-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<!-- Without floats, no clearance applies, thus margin-top of #clear + should collapse with margin-bottom of its parent element. --> +<style type="text/css"> +.separator { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-2.html b/layout/reftests/margin-collapsing/block-clear-2.html new file mode 100644 index 000000000..152c014db --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-2.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<!-- Without floats, no clearance applies, thus margin-top of #clear + should collapse with margin-bottom of its parent element. --> +<style type="text/css"> +#parent { + margin-bottom: 10px; +} +.separator { + height: 20px; + background-color: green; +} +#clear { + clear: left; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div class="separator"></div> + <div id="clear"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-3-ref-left.html b/layout/reftests/margin-collapsing/block-clear-3-ref-left.html new file mode 100644 index 000000000..14271190f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-3-ref-left.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#static { + height: 20px; + background-color: green; +} +#margin { + height: 80px; +} +#clear { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="margin"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-3-ref-right.html b/layout/reftests/margin-collapsing/block-clear-3-ref-right.html new file mode 100644 index 000000000..22b974fe4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-3-ref-right.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#static { + height: 20px; + background-color: green; +} +#margin { + height: 80px; +} +#clear { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="margin"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-3a.html b/layout/reftests/margin-collapsing/block-clear-3a.html new file mode 100644 index 000000000..a6ec21ea0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-3a.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 20px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 20px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-3b.html b/layout/reftests/margin-collapsing/block-clear-3b.html new file mode 100644 index 000000000..3e46bcbf9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-3b.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 20px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 20px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-3c.html b/layout/reftests/margin-collapsing/block-clear-3c.html new file mode 100644 index 000000000..bd11ec342 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-3c.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 40px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 40px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-3d.html b/layout/reftests/margin-collapsing/block-clear-3d.html new file mode 100644 index 000000000..08037c1ea --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-3d.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 40px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 40px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-3e.html b/layout/reftests/margin-collapsing/block-clear-3e.html new file mode 100644 index 000000000..a05961a81 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-3e.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 60px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 60px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-3f.html b/layout/reftests/margin-collapsing/block-clear-3f.html new file mode 100644 index 000000000..90710df32 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-3f.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 60px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 60px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-4-ref-left.html b/layout/reftests/margin-collapsing/block-clear-4-ref-left.html new file mode 100644 index 000000000..a98b2c7d8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-4-ref-left.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#static { + height: 20px; + background-color: green; +} +#margin { + height: 85px; +} +#clear { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="margin"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-4-ref-right.html b/layout/reftests/margin-collapsing/block-clear-4-ref-right.html new file mode 100644 index 000000000..20c6568a8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-4-ref-right.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#static { + height: 20px; + background-color: green; +} +#margin { + height: 85px; +} +#clear { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="margin"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-4a.html b/layout/reftests/margin-collapsing/block-clear-4a.html new file mode 100644 index 000000000..9130befd2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-4a.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 85px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 80px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-4b.html b/layout/reftests/margin-collapsing/block-clear-4b.html new file mode 100644 index 000000000..b18a9ab17 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-4b.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 80px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 85px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-4c.html b/layout/reftests/margin-collapsing/block-clear-4c.html new file mode 100644 index 000000000..d57c8e1c1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-4c.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 85px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 85px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-4d.html b/layout/reftests/margin-collapsing/block-clear-4d.html new file mode 100644 index 000000000..5b9231aff --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-4d.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 85px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 80px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-4e.html b/layout/reftests/margin-collapsing/block-clear-4e.html new file mode 100644 index 000000000..d42a33ffb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-4e.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 80px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 85px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-4f.html b/layout/reftests/margin-collapsing/block-clear-4f.html new file mode 100644 index 000000000..1194521f2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-4f.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#static { + margin-bottom: 85px; + height: 20px; + background-color: green; +} +#clear { + margin-top: 85px; + clear: both; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="float"></div> +<div id="static"></div> +<div id="clear"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5-left-ref.html b/layout/reftests/margin-collapsing/block-clear-5-left-ref.html new file mode 100644 index 000000000..70067ac23 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5-left-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; + background-color: lime; +} +#float { + width: 100px; height: 100px; + background-color: blue; + margin-right: auto; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5-right-ref.html b/layout/reftests/margin-collapsing/block-clear-5-right-ref.html new file mode 100644 index 000000000..d1528cae9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5-right-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#parent { + background-color: lime; +} +#float { + width: 100px; height: 100px; + background-color: blue; + margin-left: auto; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5a.html b/layout/reftests/margin-collapsing/block-clear-5a.html new file mode 100644 index 000000000..f1a3b3d09 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5a.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5b.html b/layout/reftests/margin-collapsing/block-clear-5b.html new file mode 100644 index 000000000..765f7876f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5b.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 100px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5c.html b/layout/reftests/margin-collapsing/block-clear-5c.html new file mode 100644 index 000000000..c3a8b7bbf --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5c.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 110px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5d.html b/layout/reftests/margin-collapsing/block-clear-5d.html new file mode 100644 index 000000000..70b8ebf8e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5d.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 130px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5e.html b/layout/reftests/margin-collapsing/block-clear-5e.html new file mode 100644 index 000000000..d1a7197cb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5e.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; + background-color: lime; +} +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: right; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5f.html b/layout/reftests/margin-collapsing/block-clear-5f.html new file mode 100644 index 000000000..6fcd6b3ba --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5f.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; + background-color: lime; +} +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: right; + margin-top: 100px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5g.html b/layout/reftests/margin-collapsing/block-clear-5g.html new file mode 100644 index 000000000..28b1ccba4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5g.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; + background-color: lime; +} +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: right; + margin-top: 110px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-5h.html b/layout/reftests/margin-collapsing/block-clear-5h.html new file mode 100644 index 000000000..e580e2504 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-5h.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #clear { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; + background-color: lime; +} +#float { + float: right; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: right; + margin-top: 150px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-6a-left.html b/layout/reftests/margin-collapsing/block-clear-6a-left.html new file mode 100644 index 000000000..2ab248378 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-6a-left.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-6abc-left-ref.html b/layout/reftests/margin-collapsing/block-clear-6abc-left-ref.html new file mode 100644 index 000000000..1460177fd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-6abc-left-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + height: 100px; +} +#float { + width: 100px; height: 100px; + background-color: blue; + margin-right: auto; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-6b-left.html b/layout/reftests/margin-collapsing/block-clear-6b-left.html new file mode 100644 index 000000000..be31e3272 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-6b-left.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 20px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-6c-left.html b/layout/reftests/margin-collapsing/block-clear-6c-left.html new file mode 100644 index 000000000..e5949b109 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-6c-left.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 15px; + margin-bottom: 15px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-6d-left.html b/layout/reftests/margin-collapsing/block-clear-6d-left.html new file mode 100644 index 000000000..967675e85 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-6d-left.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + margin-bottom: 30px; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-6def-left-ref1.html b/layout/reftests/margin-collapsing/block-clear-6def-left-ref1.html new file mode 100644 index 000000000..fe20c15d0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-6def-left-ref1.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + height: 100px; + margin-bottom: 30px; +} +#float { + width: 100px; height: 100px; + background-color: blue; + margin-right: auto; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-6def-left-ref2.html b/layout/reftests/margin-collapsing/block-clear-6def-left-ref2.html new file mode 100644 index 000000000..70a533bb6 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-6def-left-ref2.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + height: 100px; +} +#float { + width: 100px; height: 100px; + background-color: blue; + margin-right: auto; +} +#margin-bottom { + margin-bottom: 30px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> +</div> +<div id="margin-bottom"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-6e-left.html b/layout/reftests/margin-collapsing/block-clear-6e-left.html new file mode 100644 index 000000000..4b13a2e1f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-6e-left.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + margin-bottom: 30px; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 20px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-6f-left.html b/layout/reftests/margin-collapsing/block-clear-6f-left.html new file mode 100644 index 000000000..f4a8f3d7b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-6f-left.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + margin-bottom: 30px; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 15px; + margin-bottom: 15px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7a-left.html b/layout/reftests/margin-collapsing/block-clear-7a-left.html new file mode 100644 index 000000000..f9b4510fc --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7a-left.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 10px; + margin-bottom: 20px; +} +#clear-sibling { + margin-top: 30px; + margin-bottom: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> + <div id="clear-sibling"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7abcd-left-ref.html b/layout/reftests/margin-collapsing/block-clear-7abcd-left-ref.html new file mode 100644 index 000000000..58e416e0c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7abcd-left-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; +} +#float { + width: 100px; height: 100px; + margin-right: auto; + background-color: blue; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7b-left.html b/layout/reftests/margin-collapsing/block-clear-7b-left.html new file mode 100644 index 000000000..3656d113d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7b-left.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 20px; + margin-bottom: 30px; +} +#clear-sibling { + margin-top: 40px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> + <div id="clear-sibling"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7c-left.html b/layout/reftests/margin-collapsing/block-clear-7c-left.html new file mode 100644 index 000000000..714b8aff1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7c-left.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 30px; + margin-bottom: 40px; +} +#clear-sibling { + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> + <div id="clear-sibling"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7d-left.html b/layout/reftests/margin-collapsing/block-clear-7d-left.html new file mode 100644 index 000000000..ac3e8bd18 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7d-left.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 40px; + margin-bottom: 10px; +} +#clear-sibling { + margin-top: 20px; + margin-bottom: 30px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> + <div id="clear-sibling"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7e-left.html b/layout/reftests/margin-collapsing/block-clear-7e-left.html new file mode 100644 index 000000000..8bc855afd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7e-left.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + margin-bottom: 50px; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 10px; + margin-bottom: 20px; +} +#clear-sibling { + margin-top: 30px; + margin-bottom: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> + <div id="clear-sibling"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7efgh-left-ref1.html b/layout/reftests/margin-collapsing/block-clear-7efgh-left-ref1.html new file mode 100644 index 000000000..ddcd07b7d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7efgh-left-ref1.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + margin-bottom: 50px; + height: 100px; +} +#float { + width: 100px; height: 100px; + margin-right: auto; + background-color: blue; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7efgh-left-ref2.html b/layout/reftests/margin-collapsing/block-clear-7efgh-left-ref2.html new file mode 100644 index 000000000..176000c89 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7efgh-left-ref2.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; +} +#float { + width: 100px; height: 100px; + margin-right: auto; + background-color: blue; +} +#margin-bottom { + margin-bottom: 50px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> +</div> +<div id="margin-bottom"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7f-left.html b/layout/reftests/margin-collapsing/block-clear-7f-left.html new file mode 100644 index 000000000..360316e72 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7f-left.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + margin-bottom: 50px; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 20px; + margin-bottom: 30px; +} +#clear-sibling { + margin-top: 40px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> + <div id="clear-sibling"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7g-left.html b/layout/reftests/margin-collapsing/block-clear-7g-left.html new file mode 100644 index 000000000..5233ec359 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7g-left.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + margin-bottom: 50px; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 30px; + margin-bottom: 40px; +} +#clear-sibling { + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> + <div id="clear-sibling"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-clear-7h-left.html b/layout/reftests/margin-collapsing/block-clear-7h-left.html new file mode 100644 index 000000000..28c26d9e1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-clear-7h-left.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + background-color: lime; + margin-bottom: 50px; +} +#float { + float: left; + width: 100px; height: 100px; + background-color: blue; +} +#clear { + clear: left; + margin-top: 40px; + margin-bottom: 10px; +} +#clear-sibling { + margin-top: 20px; + margin-bottom: 30px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="float"></div> + <div id="clear"></div> + <div id="clear-sibling"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-em-length-1-dyn.html b/layout/reftests/margin-collapsing/block-em-length-1-dyn.html new file mode 100644 index 000000000..961f28753 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-em-length-1-dyn.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +body { + font-size: 20px; +} +#block1 { + height: 20px; + margin-bottom: 10em; + background-color: blue; +} +#block2 { + height: 20px; + margin-top: 5em; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('block2').style.fontSize = '50px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-em-length-1-ref.html b/layout/reftests/margin-collapsing/block-em-length-1-ref.html new file mode 100644 index 000000000..848a2382f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-em-length-1-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-size: 20px; +} +#block1 { + height: 20px; + background-color: blue; +} +#spacer { + font-size: 50px; + height: 5em; +} +#block2 { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="spacer"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-em-length-1.html b/layout/reftests/margin-collapsing/block-em-length-1.html new file mode 100644 index 000000000..bc6660314 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-em-length-1.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-size: 20px; +} +#block1 { + height: 20px; + margin-bottom: 10em; + background-color: blue; +} +#block2 { + font-size: 50px; + height: 20px; + margin-top: 5em; + background-color: blue; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-1-ref.html b/layout/reftests/margin-collapsing/block-first-child-1-ref.html new file mode 100644 index 000000000..4ea04150d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-1-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #spacer, #first-child { + height: 20px; +} +#separator, #first-child { + background-color: green; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="spacer"></div> +<div id="first-child"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-1a-dyn.html b/layout/reftests/margin-collapsing/block-first-child-1a-dyn.html new file mode 100644 index 000000000..5e0032beb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-1a-dyn.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: 10px; +} +#first-child { + display: none; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-1a.html b/layout/reftests/margin-collapsing/block-first-child-1a.html new file mode 100644 index 000000000..77d04ffa8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-1a.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: 10px; +} +#first-child { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-1b-dyn.html b/layout/reftests/margin-collapsing/block-first-child-1b-dyn.html new file mode 100644 index 000000000..971cbd597 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-1b-dyn.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; +} +#first-child { + display: none; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-1b.html b/layout/reftests/margin-collapsing/block-first-child-1b.html new file mode 100644 index 000000000..deb791e93 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-1b.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; +} +#first-child { + margin-top: 10px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-1c-dyn.html b/layout/reftests/margin-collapsing/block-first-child-1c-dyn.html new file mode 100644 index 000000000..d8d8ff715 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-1c-dyn.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; +} +#first-child { + display: none; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-1c.html b/layout/reftests/margin-collapsing/block-first-child-1c.html new file mode 100644 index 000000000..1a5f5e817 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-1c.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; +} +#first-child { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-2-dyn.html b/layout/reftests/margin-collapsing/block-first-child-2-dyn.html new file mode 100644 index 000000000..818570324 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-2-dyn.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; +} +#first-child { + margin-top: 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.marginTop = '-10px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-2-ref.html b/layout/reftests/margin-collapsing/block-first-child-2-ref.html new file mode 100644 index 000000000..9819327b5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-2-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#spacer { + height: 10px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="spacer"></div> +<div id="first-child"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-2.html b/layout/reftests/margin-collapsing/block-first-child-2.html new file mode 100644 index 000000000..fd10e6d7a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-2.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: 20px; +} +#first-child { + margin-top: -10px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-3-dyn.html b/layout/reftests/margin-collapsing/block-first-child-3-dyn.html new file mode 100644 index 000000000..635f5c65e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-3-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + margin-top: 0px; + background-color: blue; +} +#parent { + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.marginTop = '-20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-3-ref.html b/layout/reftests/margin-collapsing/block-first-child-3-ref.html new file mode 100644 index 000000000..2a2d8d9bf --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-3-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-3.html b/layout/reftests/margin-collapsing/block-first-child-3.html new file mode 100644 index 000000000..6fbe7dc32 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-3.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + margin-top: -20px; + background-color: blue; +} +#parent { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-4-dyn.html b/layout/reftests/margin-collapsing/block-first-child-4-dyn.html new file mode 100644 index 000000000..8404f83ca --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-4-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + margin-top: 0px; + background-color: blue; +} +#parent { + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.marginTop = '-30px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-4-ref.html b/layout/reftests/margin-collapsing/block-first-child-4-ref.html new file mode 100644 index 000000000..545006bc0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-4-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 10px; + background-color: green; +} +#first-child { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-4.html b/layout/reftests/margin-collapsing/block-first-child-4.html new file mode 100644 index 000000000..e8c05ef10 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-4.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + margin-top: -30px; + background-color: blue; +} +#parent { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-5-dyn.html b/layout/reftests/margin-collapsing/block-first-child-5-dyn.html new file mode 100644 index 000000000..79f7f3e50 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-5-dyn.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: 0; +} +#first-child { + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.marginTop = '-10px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-5-ref.html b/layout/reftests/margin-collapsing/block-first-child-5-ref.html new file mode 100644 index 000000000..9819327b5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-5-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#spacer { + height: 10px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="spacer"></div> +<div id="first-child"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-5.html b/layout/reftests/margin-collapsing/block-first-child-5.html new file mode 100644 index 000000000..c06c10430 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-5.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #first-child { + height: 20px; + background-color: green; +} +#parent { + margin-top: -10px; +} +#first-child { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-6-dyn.html b/layout/reftests/margin-collapsing/block-first-child-6-dyn.html new file mode 100644 index 000000000..a359c7fc1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-6-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + margin-top: 20px; + background-color: blue; +} +#parent { + margin-top: 0px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.marginTop = '-20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-6-ref.html b/layout/reftests/margin-collapsing/block-first-child-6-ref.html new file mode 100644 index 000000000..2a2d8d9bf --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-6-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-6.html b/layout/reftests/margin-collapsing/block-first-child-6.html new file mode 100644 index 000000000..66a4d81cc --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-6.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + margin-top: 20px; + background-color: blue; +} +#parent { + margin-top: -20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-7-dyn.html b/layout/reftests/margin-collapsing/block-first-child-7-dyn.html new file mode 100644 index 000000000..0e5b92878 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-7-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + margin-top: 20px; + background-color: blue; +} +#parent { + margin-top: 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.marginTop = '-30px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-7-ref.html b/layout/reftests/margin-collapsing/block-first-child-7-ref.html new file mode 100644 index 000000000..545006bc0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-7-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 10px; + background-color: green; +} +#first-child { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-7.html b/layout/reftests/margin-collapsing/block-first-child-7.html new file mode 100644 index 000000000..9245b8301 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-7.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 20px; + margin-top: 20px; + background-color: blue; +} +#parent { + margin-top: -30px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-8-ref.html b/layout/reftests/margin-collapsing/block-first-child-8-ref.html new file mode 100644 index 000000000..18ae4f0b6 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-8-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#first-child { + height: 40px; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-8a-dyn.html b/layout/reftests/margin-collapsing/block-first-child-8a-dyn.html new file mode 100644 index 000000000..b3275e757 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-8a-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 40px; + background-color: green; +} +#first-child { + display: none; + height: 40px; + margin-top: -20px; + background-color: blue; +} +#parent { + margin-top: -10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-8a.html b/layout/reftests/margin-collapsing/block-first-child-8a.html new file mode 100644 index 000000000..abbdf0a2a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-8a.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 40px; + background-color: green; +} +#first-child { + height: 40px; + margin-top: -20px; + background-color: blue; +} +#parent { + margin-top: -10px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-8b-dyn.html b/layout/reftests/margin-collapsing/block-first-child-8b-dyn.html new file mode 100644 index 000000000..20d9ec999 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-8b-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 40px; + background-color: green; +} +#first-child { + display: none; + height: 40px; + margin-top: -10px; + background-color: blue; +} +#parent { + margin-top: -20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-8b.html b/layout/reftests/margin-collapsing/block-first-child-8b.html new file mode 100644 index 000000000..6f7a6868a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-8b.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 40px; + background-color: green; +} +#first-child { + height: 40px; + margin-top: -10px; + background-color: blue; +} +#parent { + margin-top: -20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-8c-dyn.html b/layout/reftests/margin-collapsing/block-first-child-8c-dyn.html new file mode 100644 index 000000000..9fc8b6dcd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-8c-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 40px; + background-color: green; +} +#first-child { + display: none; + height: 40px; + margin-top: -20px; + background-color: blue; +} +#parent { + margin-top: -20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-first-child-8c.html b/layout/reftests/margin-collapsing/block-first-child-8c.html new file mode 100644 index 000000000..f0313cc94 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-first-child-8c.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 40px; + background-color: green; +} +#first-child { + height: 40px; + margin-top: -20px; + background-color: blue; +} +#parent { + margin-top: -20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-1-ref.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-1-ref.html new file mode 100644 index 000000000..634bb402f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-1-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 40px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-1a-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-1a-dyn.html new file mode 100644 index 000000000..57b47d795 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-1a-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-1a.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-1a.html new file mode 100644 index 000000000..4ae3e406f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-1a.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-1b-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-1b-dyn.html new file mode 100644 index 000000000..59446a7ff --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-1b-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-1b.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-1b.html new file mode 100644 index 000000000..bb8f36842 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-1b.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-2-ref.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-2-ref.html new file mode 100644 index 000000000..164173ae7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-2-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 100px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-2a-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-2a-dyn.html new file mode 100644 index 000000000..cc6525e25 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-2a-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-2a.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-2a.html new file mode 100644 index 000000000..c3471fbc8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-2a.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-2b-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-2b-dyn.html new file mode 100644 index 000000000..9e89cf483 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-2b-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-2b.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-2b.html new file mode 100644 index 000000000..c86ce6ced --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-2b.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-3-ref.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-3-ref.html new file mode 100644 index 000000000..6ed72dd24 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-3-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 140px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-3a-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-3a-dyn.html new file mode 100644 index 000000000..0fc239c00 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-3a-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 140px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-3a.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-3a.html new file mode 100644 index 000000000..5f068714f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-3a.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 140px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-3b-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-3b-dyn.html new file mode 100644 index 000000000..b61849e5e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-3b-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 140px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-3b.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-3b.html new file mode 100644 index 000000000..bf9b2a5b0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-3b.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 140px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4-ref.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4-ref.html new file mode 100644 index 000000000..0c183b896 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4a-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4a-dyn.html new file mode 100644 index 000000000..631508f54 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4a-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 50px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.height = '100px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4a.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4a.html new file mode 100644 index 000000000..ab1abbe4f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + min-height: 50px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4b-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4b-dyn.html new file mode 100644 index 000000000..ade3b453b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4b-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 50px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.height = '100px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4b.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4b.html new file mode 100644 index 000000000..92d544d11 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + min-height: 50px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4c-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4c-dyn.html new file mode 100644 index 000000000..580c181a0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4c-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.height = '50px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4c.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4c.html new file mode 100644 index 000000000..291ea8e96 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 50px; + min-height: 100px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4d-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4d-dyn.html new file mode 100644 index 000000000..afbad9e8b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4d-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.height = '50px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4d.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4d.html new file mode 100644 index 000000000..1422c1628 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4d.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 50px; + min-height: 100px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4e-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4e-dyn.html new file mode 100644 index 000000000..595c95d4a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4e-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.height = '150px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4e.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4e.html new file mode 100644 index 000000000..b2e78df61 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4e.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 150px; + max-height: 100px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4f-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4f-dyn.html new file mode 100644 index 000000000..3d31d9be4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4f-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.height = '150px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4f.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4f.html new file mode 100644 index 000000000..f4b622c13 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4f.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 150px; + max-height: 100px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4g-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4g-dyn.html new file mode 100644 index 000000000..7b4d5e858 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4g-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 150px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.height = '100px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4g.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4g.html new file mode 100644 index 000000000..292d29602 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4g.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + max-height: 150px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4h-dyn.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4h-dyn.html new file mode 100644 index 000000000..ac53663b8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4h-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 150px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent').style.height = '100px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-fix-height-last-child-4h.html b/layout/reftests/margin-collapsing/block-fix-height-last-child-4h.html new file mode 100644 index 000000000..92a18642b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-fix-height-last-child-4h.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + max-height: 150px; + background-color: lightgreen; +} +#last-child { + height: 10px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1a-dyn.html b/layout/reftests/margin-collapsing/block-float-1a-dyn.html new file mode 100644 index 000000000..072f3d372 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1a-dyn.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#float { + height: 100px; width: 50px; + margin-top: 10px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('float').style.cssFloat = 'left'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1a-noref.html b/layout/reftests/margin-collapsing/block-float-1a-noref.html new file mode 100644 index 000000000..7d9a89e00 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1a-noref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#margin { + height: 10px; +} +#float { + height: 100px; width: 50px; + margin-right: auto; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="margin"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1a-ref.html b/layout/reftests/margin-collapsing/block-float-1a-ref.html new file mode 100644 index 000000000..d591472d2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1a-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +#float { + float: left; + height: 100px; width: 50px; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1a-ref2.html b/layout/reftests/margin-collapsing/block-float-1a-ref2.html new file mode 100644 index 000000000..c48aea7c7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1a-ref2.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#margin { + height: 20px; +} +#float { + height: 100px; width: 50px; + margin-right: auto; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="margin"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1a.html b/layout/reftests/margin-collapsing/block-float-1a.html new file mode 100644 index 000000000..e0ca71036 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1a.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#float { + float: left; + height: 100px; width: 50px; + margin-top: 10px; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1b-dyn.html b/layout/reftests/margin-collapsing/block-float-1b-dyn.html new file mode 100644 index 000000000..89e7bd566 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1b-dyn.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#float { + height: 100px; width: 50px; + margin-top: 10px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('float').style.cssFloat = 'right'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1b-noref.html b/layout/reftests/margin-collapsing/block-float-1b-noref.html new file mode 100644 index 000000000..6c3291e02 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1b-noref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#margin { + height: 10px; +} +#float { + height: 100px; width: 50px; + margin-left: auto; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="margin"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1b-ref.html b/layout/reftests/margin-collapsing/block-float-1b-ref.html new file mode 100644 index 000000000..587809c1f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1b-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#float { + float: right; + height: 100px; width: 50px; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1b-ref2.html b/layout/reftests/margin-collapsing/block-float-1b-ref2.html new file mode 100644 index 000000000..07bf58837 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1b-ref2.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#margin { + height: 20px; +} +#float { + height: 100px; width: 50px; + margin-left: auto; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="margin"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-1b.html b/layout/reftests/margin-collapsing/block-float-1b.html new file mode 100644 index 000000000..a0b42df55 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-1b.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#float { + float: right; + height: 100px; width: 50px; + margin-top: 10px; + background-color: blue; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-2a-dyn.html b/layout/reftests/margin-collapsing/block-float-2a-dyn.html new file mode 100644 index 000000000..8d1f27fd4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-2a-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#float { + float: left; + width: 50px; + margin: 20px 0; + background-color: green; +} +#child { + height: 20px; + background-color: lightgreen; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('child').style.margin = '40px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="float"> + <div id="child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-2a-noref.html b/layout/reftests/margin-collapsing/block-float-2a-noref.html new file mode 100644 index 000000000..b44901788 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-2a-noref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#margin { + height: 40px; +} +#float { + height: 20px; width: 50px; + margin-right: auto; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="margin"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-2a-ref.html b/layout/reftests/margin-collapsing/block-float-2a-ref.html new file mode 100644 index 000000000..634ce320e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-2a-ref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#float { + width: 50px; + margin-right: auto; + padding: 40px 0; + background-color: green; +} +#child { + height: 20px; + background-color: lightgreen; +} +#spacer { + height: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="spacer"></div> +<div id="float"> + <div id="child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-2a.html b/layout/reftests/margin-collapsing/block-float-2a.html new file mode 100644 index 000000000..7e1128eae --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-2a.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#float { + float: left; + width: 50px; + margin: 20px 0; + background-color: green; +} +#child { + height: 20px; + margin: 40px 0; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="float"> + <div id="child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-2b-dyn.html b/layout/reftests/margin-collapsing/block-float-2b-dyn.html new file mode 100644 index 000000000..08a0c8a43 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-2b-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#float { + float: right; + width: 50px; + margin: 20px 0; + background-color: green; +} +#child { + height: 20px; + background-color: lightgreen; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('child').style.margin = '40px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="float"> + <div id="child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-2b-noref.html b/layout/reftests/margin-collapsing/block-float-2b-noref.html new file mode 100644 index 000000000..78741ba7a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-2b-noref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#margin { + height: 40px; +} +#float { + height: 20px; width: 50px; + margin-left: auto; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="margin"></div> +<div id="float"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-2b-ref.html b/layout/reftests/margin-collapsing/block-float-2b-ref.html new file mode 100644 index 000000000..358dcac89 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-2b-ref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#float { + width: 50px; + margin-left: auto; + padding: 40px 0; + background-color: green; +} +#child { + height: 20px; + background-color: lightgreen; +} +#spacer { + height: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="spacer"></div> +<div id="float"> + <div id="child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-2b.html b/layout/reftests/margin-collapsing/block-float-2b.html new file mode 100644 index 000000000..ef4320743 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-2b.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#float { + float: right; + width: 50px; + margin: 20px 0; + background-color: green; +} +#child { + height: 20px; + margin: 40px 0; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="float"> + <div id="child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-3a-dyn.html b/layout/reftests/margin-collapsing/block-float-3a-dyn.html new file mode 100644 index 000000000..be25f7639 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-3a-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#container { + width: 110px; + margin-right: auto; +} +#float1, #float2 { + width: 100px; + height: 20px; + background-color: green; +} +#float1 { + float: left; + margin-bottom: 20px; +} +#float2 { + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('float2').style.cssFloat = 'left'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="container"> + <div id="float1"></div> + <div id="float2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-3a-ref.html b/layout/reftests/margin-collapsing/block-float-3a-ref.html new file mode 100644 index 000000000..7b776b279 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-3a-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float1, #float2 { + width: 100px; + height: 20px; + background-color: green; + margin-right: auto; +} +#spacer { + height: 30px; +} +</style> +</head> +<body> +<div id="container"> + <div id="float1"></div> + <div id="spacer"></div> + <div id="float2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-3a.html b/layout/reftests/margin-collapsing/block-float-3a.html new file mode 100644 index 000000000..639e72b8b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-3a.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#container { + width: 110px; + margin-right: auto; +} +#float1, #float2 { + float: left; + width: 100px; + height: 20px; + background-color: green; +} +#float1 { + margin-bottom: 20px; +} +#float2 { + margin-top: 10px; +} +</style> +</head> +<body> +<div id="container"> + <div id="float1"></div> + <div id="float2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-3b-dyn.html b/layout/reftests/margin-collapsing/block-float-3b-dyn.html new file mode 100644 index 000000000..1fd4431a2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-3b-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#container { + width: 110px; + margin-left: auto; +} +#float1, #float2 { + width: 100px; + height: 20px; + background-color: green; +} +#float1 { + float: right; + margin-bottom: 20px; +} +#float2 { + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('float2').style.cssFloat = 'right'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="container"> + <div id="float1"></div> + <div id="float2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-3b-ref.html b/layout/reftests/margin-collapsing/block-float-3b-ref.html new file mode 100644 index 000000000..2e6734c37 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-3b-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float1, #float2 { + width: 100px; + height: 20px; + background-color: green; + margin-left: auto; +} +#spacer { + height: 30px; +} +</style> +</head> +<body> +<div id="container"> + <div id="float1"></div> + <div id="spacer"></div> + <div id="float2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-float-3b.html b/layout/reftests/margin-collapsing/block-float-3b.html new file mode 100644 index 000000000..c2ecd8d2a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-float-3b.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#container { + width: 110px; + margin-left: auto; +} +#float1, #float2 { + float: right; + width: 100px; + height: 20px; + background-color: green; +} +#float1 { + margin-bottom: 20px; +} +#float2 { + margin-top: 10px; +} +</style> +</head> +<body> +<div id="container"> + <div id="float1"></div> + <div id="float2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-1-dyn.html b/layout/reftests/margin-collapsing/block-horizontal-1-dyn.html new file mode 100644 index 000000000..6ff99c0e7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-1-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#float-blue { + float: left; + margin-right: 20px; + background-color: blue; + width: 40px; + height: 100px; +} +.dyn { + display: none; +} +.float-green { + float: left; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByClassName('dyn')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="float-blue"></div> +<div class="float-green dyn"></div> +<div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-1-noref.html b/layout/reftests/margin-collapsing/block-horizontal-1-noref.html new file mode 100644 index 000000000..4d7a7ccb9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-1-noref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: left; + margin-right: 20px; + background-color: blue; + width: 40px; + height: 100px; +} +.float-green { + float: left; + margin-right: 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div> +<div class="float-green"></div> +<div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-1-ref.html b/layout/reftests/margin-collapsing/block-horizontal-1-ref.html new file mode 100644 index 000000000..9a49a81e0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-1-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: left; + margin-right: 40px; + background-color: blue; + width: 40px; + height: 100px; +} +.float-green { + float: left; + margin-right: 40px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div> +<div class="float-green"></div> +<div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-1.html b/layout/reftests/margin-collapsing/block-horizontal-1.html new file mode 100644 index 000000000..5bbdcca39 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-1.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: left; + margin-right: 20px; + background-color: blue; + width: 40px; + height: 100px; +} +.float-green { + float: left; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div> +<div class="float-green"></div> +<div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-2-dyn.html b/layout/reftests/margin-collapsing/block-horizontal-2-dyn.html new file mode 100644 index 000000000..fbcdda8e9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-2-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#float-blue { + float: right; + margin-left: 20px; + background-color: blue; + width: 40px; + height: 100px; +} +.dyn { + display: none; +} +.float-green { + float: right; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByClassName('dyn')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="float-blue"></div> +<div class="float-green dyn"></div> +<div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-2-noref.html b/layout/reftests/margin-collapsing/block-horizontal-2-noref.html new file mode 100644 index 000000000..8eb2dd12f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-2-noref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: right; + margin-left: 20px; + background-color: blue; + width: 40px; + height: 100px; +} +.float-green { + float: right; + margin-left: 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div> +<div class="float-green"></div> +<div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-2-ref.html b/layout/reftests/margin-collapsing/block-horizontal-2-ref.html new file mode 100644 index 000000000..21946ee30 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-2-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: right; + margin-left: 40px; + background-color: blue; + width: 40px; + height: 100px; +} +.float-green { + float: right; + margin-left: 40px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div> +<div class="float-green"></div> +<div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-2.html b/layout/reftests/margin-collapsing/block-horizontal-2.html new file mode 100644 index 000000000..8b1244528 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-2.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: right; + margin-left: 20px; + background-color: blue; + width: 40px; + height: 100px; +} +.float-green { + float: right; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div> +<div class="float-green"></div> +<div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-3-dyn.html b/layout/reftests/margin-collapsing/block-horizontal-3-dyn.html new file mode 100644 index 000000000..8d0c6d2d5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-3-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#float-blue { + float: left; + margin-right: 20px; + background-color: blue; + height: 100px; +} +.dyn { + display: none; +} +.float-green { + float: left; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByClassName('dyn')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="float-blue"><div class="float-green dyn"></div></div><div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-3-noref.html b/layout/reftests/margin-collapsing/block-horizontal-3-noref.html new file mode 100644 index 000000000..b2f9e4e2a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-3-noref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: left; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +.float-green { + float: left; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div><div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-3-ref.html b/layout/reftests/margin-collapsing/block-horizontal-3-ref.html new file mode 100644 index 000000000..9b84cbeb5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-3-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: left; + margin-right: 40px; + border: solid blue; + border-width: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +.float-green { + float: left; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div><div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-3.html b/layout/reftests/margin-collapsing/block-horizontal-3.html new file mode 100644 index 000000000..d10c1f13c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-3.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: left; + margin-right: 20px; + background-color: blue; + height: 100px; +} +.float-green { + float: left; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"><div class="float-green"></div></div><div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-4-dyn.html b/layout/reftests/margin-collapsing/block-horizontal-4-dyn.html new file mode 100644 index 000000000..f51ad16cf --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-4-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#float-blue { + float: right; + margin-left: 20px; + background-color: blue; + height: 100px; +} +.dyn { + display: none; +} +.float-green { + float: right; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByClassName('dyn')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="float-blue"><div class="float-green dyn"></div></div><div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-4-noref.html b/layout/reftests/margin-collapsing/block-horizontal-4-noref.html new file mode 100644 index 000000000..5ed5bd06e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-4-noref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: right; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +.float-green { + float: right; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div><div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-4-ref.html b/layout/reftests/margin-collapsing/block-horizontal-4-ref.html new file mode 100644 index 000000000..263530d2f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-4-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: right; + margin-left: 40px; + border: solid blue; + border-width: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +.float-green { + float: right; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"></div><div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-horizontal-4.html b/layout/reftests/margin-collapsing/block-horizontal-4.html new file mode 100644 index 000000000..6a4e5c1e2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-horizontal-4.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#float-blue { + float: right; + margin-left: 20px; + background-color: blue; + height: 100px; +} +.float-green { + float: right; + margin: 0 20px; + background-color: green; + width: 40px; + height: 100px; +} +</style> +</head> +<body> +<div id="float-blue"><div class="float-green"></div></div><div class="float-green"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-body-1-noref.html b/layout/reftests/margin-collapsing/block-html-body-1-noref.html new file mode 100644 index 000000000..7f14949b2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-body-1-noref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 0; + background-color: green; +} +div { + margin: 30px 20px; + background-color: red; + height: 20px; +} +div div { + margin: 50px; + background-color: blue; +} +</style> +</head> +<body> +<div><div></div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-body-1-ref.html b/layout/reftests/margin-collapsing/block-html-body-1-ref.html new file mode 100644 index 000000000..1d898d317 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-body-1-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html { + margin: 0; padding: 30px 20px; + background-color: green; +} +body { + margin: 0; padding: 0 30px; + background-color: red; +} +div { + background-color: blue; + height: 20px; +} +</style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-body-1-ref2.html b/layout/reftests/margin-collapsing/block-html-body-1-ref2.html new file mode 100644 index 000000000..f527a4c25 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-body-1-ref2.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 0; + background-color: green; +} +div { + margin: 30px 20px; + background-color: red; + height: 20px; +} +div div { + margin: 30px; + background-color: blue; +} +</style> +</head> +<body> +<div><div></div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-body-1.html b/layout/reftests/margin-collapsing/block-html-body-1.html new file mode 100644 index 000000000..c0b07ed16 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-body-1.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html { + margin: 0; padding: 0; + background-color: green; +} +body { + margin: 20px; padding: 0; + background-color: red; +} +div { + margin: 30px; + background-color: blue; + height: 20px; +} +</style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-1-ref.html b/layout/reftests/margin-collapsing/block-html-html-1-ref.html new file mode 100644 index 000000000..103ae9f59 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-1-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> + <style type="text/css"> + html, body { + background-color: white; + margin: 0; padding: 0; + } + #the-html { + padding: 30px 0; + } + #the-body { + background-color: green; + height: 100px; + } + </style> +</head> +<body> +<div id="the-html"> + <div id="the-body"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-1a-dyn.html b/layout/reftests/margin-collapsing/block-html-html-1a-dyn.html new file mode 100644 index 000000000..40d28aa32 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-1a-dyn.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 20px 0; + } + body { + display: none; + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> + <script type="text/javascript"> + function test() { + document.getElementsByTagName('body')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); + } + document.addEventListener('MozReftestInvalidate', test, false); + </script> +</head> +<body> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-1a.html b/layout/reftests/margin-collapsing/block-html-html-1a.html new file mode 100644 index 000000000..dafa925ad --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-1a.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 20px 0; + } + body { + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> +</head> +<body> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-1b-dyn.html b/layout/reftests/margin-collapsing/block-html-html-1b-dyn.html new file mode 100644 index 000000000..cf5a42041 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-1b-dyn.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 20px 0; + } + div { + display: none; + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> + <script type="text/javascript"> + function test() { + document.getElementsByTagName('div')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); + } + document.addEventListener('MozReftestInvalidate', test, false); + </script> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-1b.html b/layout/reftests/margin-collapsing/block-html-html-1b.html new file mode 100644 index 000000000..f302b81c7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-1b.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 20px 0; + } + div { + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-2-dyn.html b/layout/reftests/margin-collapsing/block-html-html-2-dyn.html new file mode 100644 index 000000000..91f98b84e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-2-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + } + body { + background-color: red; + margin: 20px 0; + } + div { + display: none; + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> + <script type="text/javascript"> + function test() { + document.getElementsByTagName('div')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); + } + document.addEventListener('MozReftestInvalidate', test, false); + </script> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-2-ref.html b/layout/reftests/margin-collapsing/block-html-html-2-ref.html new file mode 100644 index 000000000..6e0f6d89e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-2-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> + <style type="text/css"> + html, body, div { + margin: 0; padding: 0; + background-color: white; + } + #the-html { + padding: 20px 0; + } + #the-body { + background-color: red; + } + #the-div { + background-color: green; + height: 100px; + } + </style> +</head> +<body> +<div id="the-html"> + <div id="the-body"> + <div id="the-div"></div> + </div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-2.html b/layout/reftests/margin-collapsing/block-html-html-2.html new file mode 100644 index 000000000..aeb007ab9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-2.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + } + body { + background-color: red; + margin: 20px 0; + } + div { + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-3-dyn.html b/layout/reftests/margin-collapsing/block-html-html-3-dyn.html new file mode 100644 index 000000000..7f3c7f493 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-3-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 10px 0; + } + body { + background-color: red; + margin: 20px 0; + } + div { + display: none; + background-color: green; + margin: 40px 0; + height: 100px; + } + </style> + <script type="text/javascript"> + function test() { + document.getElementsByTagName('div')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); + } + document.addEventListener('MozReftestInvalidate', test, false); + </script> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-3-ref.html b/layout/reftests/margin-collapsing/block-html-html-3-ref.html new file mode 100644 index 000000000..f9c935f37 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-3-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> + <style type="text/css"> + html, body, div { + margin: 0; padding: 0; + background-color: white; + } + #the-html { + padding: 50px 0; + } + #the-body { + background-color: red; + } + #the-div { + background-color: green; + height: 100px; + } + </style> +</head> +<body> +<div id="the-html"> + <div id="the-body"> + <div id="the-div"></div> + </div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-html-html-3.html b/layout/reftests/margin-collapsing/block-html-html-3.html new file mode 100644 index 000000000..b056b0a2e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-html-html-3.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 10px 0; + } + body { + background-color: red; + margin: 20px 0; + } + div { + background-color: green; + margin: 40px 0; + height: 100px; + } + </style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-1-ref.html b/layout/reftests/margin-collapsing/block-last-child-1-ref.html new file mode 100644 index 000000000..06499e47d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-1-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent, #child, #separator { + height: 20px; +} +#parent, #separator { + background-color: green; +} +</style> +</head> +<body> +<div id="parent"></div> +<div id="child"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-1a.html b/layout/reftests/margin-collapsing/block-last-child-1a.html new file mode 100644 index 000000000..0254a1100 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-1a.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 10px; +} +#child { + margin-bottom: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-1b.html b/layout/reftests/margin-collapsing/block-last-child-1b.html new file mode 100644 index 000000000..e4b75680d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-1b.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +#child { + margin-bottom: 10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-1c.html b/layout/reftests/margin-collapsing/block-last-child-1c.html new file mode 100644 index 000000000..322004da7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-1c.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#child, #separator { + height: 20px; + background-color: green; +} +#parent { + margin-bottom: 20px; +} +#child { + margin-bottom: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-2-ref.html b/layout/reftests/margin-collapsing/block-last-child-2-ref.html new file mode 100644 index 000000000..49705dfcb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-2-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 95px; + background-color: green; +} +#child { + height: 5px; + background-color: blue; + margin-bottom: 20px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"></div> +<div id="child"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-2a.html b/layout/reftests/margin-collapsing/block-last-child-2a.html new file mode 100644 index 000000000..6c7f1ada9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-2a.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 95px; + background-color: green; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-2b.html b/layout/reftests/margin-collapsing/block-last-child-2b.html new file mode 100644 index 000000000..887b3a239 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-2b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 95px; + background-color: green; + margin-bottom: 5px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-2c.html b/layout/reftests/margin-collapsing/block-last-child-2c.html new file mode 100644 index 000000000..434ff9a02 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-2c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 95px; + background-color: green; + margin-bottom: 10px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-2d.html b/layout/reftests/margin-collapsing/block-last-child-2d.html new file mode 100644 index 000000000..2409e2504 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-2d.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 95px; + background-color: green; + margin-bottom: 30px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-3-ref.html b/layout/reftests/margin-collapsing/block-last-child-3-ref.html new file mode 100644 index 000000000..8c26ba8bc --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-3-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: green; +} +#child { + height: 20px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"></div> +<div id="child"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-3a.html b/layout/reftests/margin-collapsing/block-last-child-3a.html new file mode 100644 index 000000000..417edaf34 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-3a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 100px; + background-color: green; + margin-bottom: -10px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-3b.html b/layout/reftests/margin-collapsing/block-last-child-3b.html new file mode 100644 index 000000000..a10cbfe2a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-3b.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 100px; + background-color: green; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-3c.html b/layout/reftests/margin-collapsing/block-last-child-3c.html new file mode 100644 index 000000000..ed5f26bb9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-3c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 100px; + background-color: green; + margin-bottom: 10px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-3d.html b/layout/reftests/margin-collapsing/block-last-child-3d.html new file mode 100644 index 000000000..dd2a68563 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-3d.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 100px; + background-color: green; + margin-bottom: 30px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-4-ref.html b/layout/reftests/margin-collapsing/block-last-child-4-ref.html new file mode 100644 index 000000000..a94d25bf6 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-4-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: green; +} +#child { + height: 10px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"></div> +<div id="child"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-4a.html b/layout/reftests/margin-collapsing/block-last-child-4a.html new file mode 100644 index 000000000..a21f65636 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-4a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 90px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 100px; + background-color: green; + margin-bottom: -15px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-4b.html b/layout/reftests/margin-collapsing/block-last-child-4b.html new file mode 100644 index 000000000..0c5c1e761 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-4b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 90px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 100px; + background-color: green; + margin-bottom: -10px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-4c.html b/layout/reftests/margin-collapsing/block-last-child-4c.html new file mode 100644 index 000000000..65935a413 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-4c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 90px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 100px; + background-color: green; + margin-bottom: 5px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-last-child-4d.html b/layout/reftests/margin-collapsing/block-last-child-4d.html new file mode 100644 index 000000000..9aa1b7799 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-last-child-4d.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 90px; + background-color: blue; + margin-bottom: 20px; +} +#child { + height: 100px; + background-color: green; + margin-bottom: 20px; +} +#separator { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-1-ref.html b/layout/reftests/margin-collapsing/block-max-height-last-child-1-ref.html new file mode 100644 index 000000000..b76d867c9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-1-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 40px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-1a-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-1a-dyn.html new file mode 100644 index 000000000..2b2597a67 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-1a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-1a.html b/layout/reftests/margin-collapsing/block-max-height-last-child-1a.html new file mode 100644 index 000000000..eb47983d5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-1a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-1b-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-1b-dyn.html new file mode 100644 index 000000000..c86b52d54 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-1b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-1b.html b/layout/reftests/margin-collapsing/block-max-height-last-child-1b.html new file mode 100644 index 000000000..329452380 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-1b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-1c-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-1c-dyn.html new file mode 100644 index 000000000..1cb045b65 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-1c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-1c.html b/layout/reftests/margin-collapsing/block-max-height-last-child-1c.html new file mode 100644 index 000000000..159c13fe9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-1c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-2-ref.html b/layout/reftests/margin-collapsing/block-max-height-last-child-2-ref.html new file mode 100644 index 000000000..b964f40f0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-2-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 40px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-2a-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-2a-dyn.html new file mode 100644 index 000000000..44483cf25 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-2a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-2a.html b/layout/reftests/margin-collapsing/block-max-height-last-child-2a.html new file mode 100644 index 000000000..e4c3c3595 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-2a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-2b-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-2b-dyn.html new file mode 100644 index 000000000..eb1b3f21f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-2b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-2b.html b/layout/reftests/margin-collapsing/block-max-height-last-child-2b.html new file mode 100644 index 000000000..bab2c4562 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-2b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-3-ref.html b/layout/reftests/margin-collapsing/block-max-height-last-child-3-ref.html new file mode 100644 index 000000000..a6a8894c7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-3-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-3a-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-3a-dyn.html new file mode 100644 index 000000000..921d6c6eb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-3a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-3a.html b/layout/reftests/margin-collapsing/block-max-height-last-child-3a.html new file mode 100644 index 000000000..730696219 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-3a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-3b-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-3b-dyn.html new file mode 100644 index 000000000..74b2356f5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-3b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-3b.html b/layout/reftests/margin-collapsing/block-max-height-last-child-3b.html new file mode 100644 index 000000000..ceacff109 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-3b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-3c-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-3c-dyn.html new file mode 100644 index 000000000..d7f06feaa --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-3c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-3c.html b/layout/reftests/margin-collapsing/block-max-height-last-child-3c.html new file mode 100644 index 000000000..4653fe60b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-3c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-4-ref.html b/layout/reftests/margin-collapsing/block-max-height-last-child-4-ref.html new file mode 100644 index 000000000..ea6b932c8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-4-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 100px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-4a-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-4a-dyn.html new file mode 100644 index 000000000..f497ae86b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-4a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-4a.html b/layout/reftests/margin-collapsing/block-max-height-last-child-4a.html new file mode 100644 index 000000000..0247f34a9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-4a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-4b-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-4b-dyn.html new file mode 100644 index 000000000..a709dc722 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-4b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-4b.html b/layout/reftests/margin-collapsing/block-max-height-last-child-4b.html new file mode 100644 index 000000000..529868a2c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-4b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-4c-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-4c-dyn.html new file mode 100644 index 000000000..df1ad92af --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-4c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-4c.html b/layout/reftests/margin-collapsing/block-max-height-last-child-4c.html new file mode 100644 index 000000000..06ea9ecf1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-4c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-5-ref.html b/layout/reftests/margin-collapsing/block-max-height-last-child-5-ref.html new file mode 100644 index 000000000..cdd824aab --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-5-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 100px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-5a-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-5a-dyn.html new file mode 100644 index 000000000..8c5d5808f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-5a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-5a.html b/layout/reftests/margin-collapsing/block-max-height-last-child-5a.html new file mode 100644 index 000000000..745773dc0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-5a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-5b-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-5b-dyn.html new file mode 100644 index 000000000..51eee03af --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-5b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-5b.html b/layout/reftests/margin-collapsing/block-max-height-last-child-5b.html new file mode 100644 index 000000000..052310f0e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-5b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-6-ref.html b/layout/reftests/margin-collapsing/block-max-height-last-child-6-ref.html new file mode 100644 index 000000000..d9cb40f16 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-6-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 80px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-6a-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-6a-dyn.html new file mode 100644 index 000000000..d77f3ee4d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-6a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-6a.html b/layout/reftests/margin-collapsing/block-max-height-last-child-6a.html new file mode 100644 index 000000000..45f610a7f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-6a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-6b-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-6b-dyn.html new file mode 100644 index 000000000..fdb11f2b2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-6b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-6b.html b/layout/reftests/margin-collapsing/block-max-height-last-child-6b.html new file mode 100644 index 000000000..8dfaf2597 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-6b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-6c-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-6c-dyn.html new file mode 100644 index 000000000..38b995561 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-6c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-6c.html b/layout/reftests/margin-collapsing/block-max-height-last-child-6c.html new file mode 100644 index 000000000..3d863d53b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-6c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-7-ref.html b/layout/reftests/margin-collapsing/block-max-height-last-child-7-ref.html new file mode 100644 index 000000000..59874fd98 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-7-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 110px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-7a-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-7a-dyn.html new file mode 100644 index 000000000..7267d624a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-7a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-7a.html b/layout/reftests/margin-collapsing/block-max-height-last-child-7a.html new file mode 100644 index 000000000..2899427b7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-7a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-7b-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-7b-dyn.html new file mode 100644 index 000000000..4015bc381 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-7b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-7b.html b/layout/reftests/margin-collapsing/block-max-height-last-child-7b.html new file mode 100644 index 000000000..cac7e61ef --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-7b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-7c-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-7c-dyn.html new file mode 100644 index 000000000..81588dafd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-7c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-7c.html b/layout/reftests/margin-collapsing/block-max-height-last-child-7c.html new file mode 100644 index 000000000..07f9bfbee --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-7c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-8-ref.html b/layout/reftests/margin-collapsing/block-max-height-last-child-8-ref.html new file mode 100644 index 000000000..ed164173f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-8-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 110px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-8a-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-8a-dyn.html new file mode 100644 index 000000000..c507ebb3a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-8a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-8a.html b/layout/reftests/margin-collapsing/block-max-height-last-child-8a.html new file mode 100644 index 000000000..439b1cca5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-8a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-8b-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-8b-dyn.html new file mode 100644 index 000000000..2a6740ca1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-8b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-8b.html b/layout/reftests/margin-collapsing/block-max-height-last-child-8b.html new file mode 100644 index 000000000..5a0197590 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-8b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-9-ref.html b/layout/reftests/margin-collapsing/block-max-height-last-child-9-ref.html new file mode 100644 index 000000000..ecacfcced --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-9-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 110px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; + position: relative; + top: -30px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-9a-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-9a-dyn.html new file mode 100644 index 000000000..f5f4969ee --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-9a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-9a.html b/layout/reftests/margin-collapsing/block-max-height-last-child-9a.html new file mode 100644 index 000000000..1e453b702 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-9a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-9b-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-9b-dyn.html new file mode 100644 index 000000000..d041af76a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-9b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-9b.html b/layout/reftests/margin-collapsing/block-max-height-last-child-9b.html new file mode 100644 index 000000000..54058c442 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-9b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-9c-dyn.html b/layout/reftests/margin-collapsing/block-max-height-last-child-9c-dyn.html new file mode 100644 index 000000000..08b153458 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-9c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-max-height-last-child-9c.html b/layout/reftests/margin-collapsing/block-max-height-last-child-9c.html new file mode 100644 index 000000000..d14519000 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-max-height-last-child-9c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + max-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-1-ref.html b/layout/reftests/margin-collapsing/block-min-height-last-child-1-ref.html new file mode 100644 index 000000000..2de1ed215 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-1-ref.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 40px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-1a-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-1a-dyn.html new file mode 100644 index 000000000..39fd51d40 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-1a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-1a.html b/layout/reftests/margin-collapsing/block-min-height-last-child-1a.html new file mode 100644 index 000000000..6fef0cbf8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-1a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-1b-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-1b-dyn.html new file mode 100644 index 000000000..6dc30e171 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-1b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-1b.html b/layout/reftests/margin-collapsing/block-min-height-last-child-1b.html new file mode 100644 index 000000000..71e4884ee --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-1b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-1c-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-1c-dyn.html new file mode 100644 index 000000000..6bace967a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-1c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-1c.html b/layout/reftests/margin-collapsing/block-min-height-last-child-1c.html new file mode 100644 index 000000000..ef01b9559 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-1c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-2-ref.html b/layout/reftests/margin-collapsing/block-min-height-last-child-2-ref.html new file mode 100644 index 000000000..2a0f94610 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-2-ref.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 100px; + background-color: lightgreen; +} +#last-child { + height: 40px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-2a-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-2a-dyn.html new file mode 100644 index 000000000..ed996bdfa --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-2a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-2a.html b/layout/reftests/margin-collapsing/block-min-height-last-child-2a.html new file mode 100644 index 000000000..853d8f62d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-2a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-2b-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-2b-dyn.html new file mode 100644 index 000000000..66cb0c840 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-2b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-2b.html b/layout/reftests/margin-collapsing/block-min-height-last-child-2b.html new file mode 100644 index 000000000..3ec90c19b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-2b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-3-ref.html b/layout/reftests/margin-collapsing/block-min-height-last-child-3-ref.html new file mode 100644 index 000000000..61d8b83ea --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-3-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 80px; + background-color: lightgreen; +} +#last-child { + height: 40px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-3a-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-3a-dyn.html new file mode 100644 index 000000000..b5559297d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-3a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-3a.html b/layout/reftests/margin-collapsing/block-min-height-last-child-3a.html new file mode 100644 index 000000000..542afd0e7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-3a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-3b-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-3b-dyn.html new file mode 100644 index 000000000..de4800bd2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-3b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-3b.html b/layout/reftests/margin-collapsing/block-min-height-last-child-3b.html new file mode 100644 index 000000000..8988bed36 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-3b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-3c-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-3c-dyn.html new file mode 100644 index 000000000..3f3b36bab --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-3c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-3c.html b/layout/reftests/margin-collapsing/block-min-height-last-child-3c.html new file mode 100644 index 000000000..2d969df6d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-3c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 40px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-4-ref.html b/layout/reftests/margin-collapsing/block-min-height-last-child-4-ref.html new file mode 100644 index 000000000..ea6b932c8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-4-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 100px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-4a-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-4a-dyn.html new file mode 100644 index 000000000..5abd7aeaf --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-4a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-4a.html b/layout/reftests/margin-collapsing/block-min-height-last-child-4a.html new file mode 100644 index 000000000..6e2081cc3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-4a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-4b-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-4b-dyn.html new file mode 100644 index 000000000..cc2367170 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-4b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-4b.html b/layout/reftests/margin-collapsing/block-min-height-last-child-4b.html new file mode 100644 index 000000000..8f27e3804 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-4b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-4c-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-4c-dyn.html new file mode 100644 index 000000000..876803f42 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-4c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-4c.html b/layout/reftests/margin-collapsing/block-min-height-last-child-4c.html new file mode 100644 index 000000000..8858ae727 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-4c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-5-ref.html b/layout/reftests/margin-collapsing/block-min-height-last-child-5-ref.html new file mode 100644 index 000000000..cdd824aab --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-5-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 100px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-5a-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-5a-dyn.html new file mode 100644 index 000000000..53cec5dab --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-5a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-5a.html b/layout/reftests/margin-collapsing/block-min-height-last-child-5a.html new file mode 100644 index 000000000..dd01bfada --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-5a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-5b-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-5b-dyn.html new file mode 100644 index 000000000..1a4deb120 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-5b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-5b.html b/layout/reftests/margin-collapsing/block-min-height-last-child-5b.html new file mode 100644 index 000000000..3856c32ad --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-5b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-6-ref.html b/layout/reftests/margin-collapsing/block-min-height-last-child-6-ref.html new file mode 100644 index 000000000..d9cb40f16 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-6-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 80px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-6a-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-6a-dyn.html new file mode 100644 index 000000000..515998217 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-6a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-6a.html b/layout/reftests/margin-collapsing/block-min-height-last-child-6a.html new file mode 100644 index 000000000..64ed1366e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-6a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-6b-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-6b-dyn.html new file mode 100644 index 000000000..fcb545775 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-6b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-6b.html b/layout/reftests/margin-collapsing/block-min-height-last-child-6b.html new file mode 100644 index 000000000..93a0c5162 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-6b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-6c-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-6c-dyn.html new file mode 100644 index 000000000..4a9451086 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-6c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-6c.html b/layout/reftests/margin-collapsing/block-min-height-last-child-6c.html new file mode 100644 index 000000000..e22e6d615 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-6c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 100px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-7-ref.html b/layout/reftests/margin-collapsing/block-min-height-last-child-7-ref.html new file mode 100644 index 000000000..26b1d4df5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-7-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 110px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 20px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-7a-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-7a-dyn.html new file mode 100644 index 000000000..3b666cd3c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-7a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-7a.html b/layout/reftests/margin-collapsing/block-min-height-last-child-7a.html new file mode 100644 index 000000000..f75fa6019 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-7a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 10px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-7b-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-7b-dyn.html new file mode 100644 index 000000000..4d40f8504 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-7b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-7b.html b/layout/reftests/margin-collapsing/block-min-height-last-child-7b.html new file mode 100644 index 000000000..dc8fedbb0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-7b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: 10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-7c-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-7c-dyn.html new file mode 100644 index 000000000..59b738b01 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-7c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-7c.html b/layout/reftests/margin-collapsing/block-min-height-last-child-7c.html new file mode 100644 index 000000000..a01b18615 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-7c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-8-ref.html b/layout/reftests/margin-collapsing/block-min-height-last-child-8-ref.html new file mode 100644 index 000000000..59874fd98 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-8-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 110px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +#spacer { + height: 10px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-8a-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-8a-dyn.html new file mode 100644 index 000000000..43d0509bc --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-8a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-8a.html b/layout/reftests/margin-collapsing/block-min-height-last-child-8a.html new file mode 100644 index 000000000..79f4f1d21 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-8a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: 20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-8b-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-8b-dyn.html new file mode 100644 index 000000000..d0a5d6bf1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-8b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-8b.html b/layout/reftests/margin-collapsing/block-min-height-last-child-8b.html new file mode 100644 index 000000000..6cf40bb7b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-8b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: 20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-9-ref.html b/layout/reftests/margin-collapsing/block-min-height-last-child-9-ref.html new file mode 100644 index 000000000..e43bf9cc0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-9-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: lightgreen; +} +#last-child { + height: 90px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-9a-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-9a-dyn.html new file mode 100644 index 000000000..856d0337c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-9a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-9a.html b/layout/reftests/margin-collapsing/block-min-height-last-child-9a.html new file mode 100644 index 000000000..dd239c8f4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-9a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -10px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-9b-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-9b-dyn.html new file mode 100644 index 000000000..b848ccf55 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-9b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-9b.html b/layout/reftests/margin-collapsing/block-min-height-last-child-9b.html new file mode 100644 index 000000000..d150f2eea --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-9b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: -10px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-9c-dyn.html b/layout/reftests/margin-collapsing/block-min-height-last-child-9c-dyn.html new file mode 100644 index 000000000..9016ab8b5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-9c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + display: none; + height: 110px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-min-height-last-child-9c.html b/layout/reftests/margin-collapsing/block-min-height-last-child-9c.html new file mode 100644 index 000000000..7bf119ff3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-min-height-last-child-9c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + min-height: 100px; + margin-bottom: -20px; + background-color: lightgreen; +} +#last-child { + height: 110px; + margin-bottom: -20px; + background-color: green; +} +#separator { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="parent"> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-1-noref1.html b/layout/reftests/margin-collapsing/block-negative-1-noref1.html new file mode 100644 index 000000000..33aa13935 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-1-noref1.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-1-noref2.html b/layout/reftests/margin-collapsing/block-negative-1-noref2.html new file mode 100644 index 000000000..78105ea3e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-1-noref2.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; +} +#margin { + height: 20px; +} +#b { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="margin"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-1-ref.html b/layout/reftests/margin-collapsing/block-negative-1-ref.html new file mode 100644 index 000000000..cb8de3293 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-1-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; +} +#b { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-1a-dyn1.html b/layout/reftests/margin-collapsing/block-negative-1a-dyn1.html new file mode 100644 index 000000000..1aeca5d84 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-1a-dyn1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#b { + display: none; + height: 20px; + background-color: blue; + margin-top: -20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('b').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-1a-dyn2.html b/layout/reftests/margin-collapsing/block-negative-1a-dyn2.html new file mode 100644 index 000000000..ddccf0305 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-1a-dyn2.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: blue; + margin-top: 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('b').style.marginTop = '-20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-1a.html b/layout/reftests/margin-collapsing/block-negative-1a.html new file mode 100644 index 000000000..de0be2bec --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-1a.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: blue; + margin-top: -20px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-1b-dyn1.html b/layout/reftests/margin-collapsing/block-negative-1b-dyn1.html new file mode 100644 index 000000000..18bd06405 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-1b-dyn1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: -20px; +} +#b { + display: none; + height: 20px; + background-color: blue; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('b').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-1b-dyn2.html b/layout/reftests/margin-collapsing/block-negative-1b-dyn2.html new file mode 100644 index 000000000..a7d422d30 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-1b-dyn2.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: -20px; +} +#b { + height: 20px; + background-color: blue; + margin-top: 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('b').style.marginTop = '20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-1b.html b/layout/reftests/margin-collapsing/block-negative-1b.html new file mode 100644 index 000000000..f1eed8c0f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-1b.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: -20px; +} +#b { + height: 20px; + background-color: blue; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-2-noref1.html b/layout/reftests/margin-collapsing/block-negative-2-noref1.html new file mode 100644 index 000000000..8252871a3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-2-noref1.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#b { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-2-noref2.html b/layout/reftests/margin-collapsing/block-negative-2-noref2.html new file mode 100644 index 000000000..cb8de3293 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-2-noref2.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; +} +#b { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-2-ref.html b/layout/reftests/margin-collapsing/block-negative-2-ref.html new file mode 100644 index 000000000..90571cbd8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-2-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#b { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-2a-dyn1.html b/layout/reftests/margin-collapsing/block-negative-2a-dyn1.html new file mode 100644 index 000000000..07ae93e67 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-2a-dyn1.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; +} +#b { + display: none; + height: 20px; + background-color: blue; + margin-top: -20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('b').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-2a-dyn2.html b/layout/reftests/margin-collapsing/block-negative-2a-dyn2.html new file mode 100644 index 000000000..199463f49 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-2a-dyn2.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; +} +#b { + height: 20px; + background-color: blue; + margin-top: 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('b').style.marginTop = '-20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-2a.html b/layout/reftests/margin-collapsing/block-negative-2a.html new file mode 100644 index 000000000..995a0805a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-2a.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; +} +#b { + height: 20px; + background-color: blue; + margin-top: -20px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-2b-dyn1.html b/layout/reftests/margin-collapsing/block-negative-2b-dyn1.html new file mode 100644 index 000000000..6f6b99d56 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-2b-dyn1.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + display: none; + height: 20px; + background-color: green; + margin-bottom: -20px; +} +#b { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('a').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-2b-dyn2.html b/layout/reftests/margin-collapsing/block-negative-2b-dyn2.html new file mode 100644 index 000000000..067ff3552 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-2b-dyn2.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 0; +} +#b { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('a').style.marginBottom = '-20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-2b.html b/layout/reftests/margin-collapsing/block-negative-2b.html new file mode 100644 index 000000000..96e43a985 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-2b.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: -20px; +} +#b { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3-noref1.html b/layout/reftests/margin-collapsing/block-negative-3-noref1.html new file mode 100644 index 000000000..6e36e4f35 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3-noref1.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + margin-bottom: 100px; +} +</style> +</head> +<body> +<div id="positive"></div> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3-noref2.html b/layout/reftests/margin-collapsing/block-negative-3-noref2.html new file mode 100644 index 000000000..900c8c4fa --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3-noref2.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 100px; +} +#positive, #negative { + background-color: green; + height: 20px; +} +</style> +</head> +<body> +<div id="positive"></div> +<div></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3-ref.html b/layout/reftests/margin-collapsing/block-negative-3-ref.html new file mode 100644 index 000000000..8b4733d4a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + margin-bottom: 20px; +} +</style> +</head> +<body> +<div id="positive"></div> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3-ref2.html b/layout/reftests/margin-collapsing/block-negative-3-ref2.html new file mode 100644 index 000000000..92bd96df0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3-ref2.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; +} +#positive, #negative { + background-color: green; +} +</style> +</head> +<body> +<div id="positive"></div> +<div></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3a-dyn1.html b/layout/reftests/margin-collapsing/block-negative-3a-dyn1.html new file mode 100644 index 000000000..d17f7ff5f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3a-dyn1.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + margin-bottom: 100px; +} +#negative { + display: none; + margin-top: -80px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('negative').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="positive"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3a-dyn2.html b/layout/reftests/margin-collapsing/block-negative-3a-dyn2.html new file mode 100644 index 000000000..c494ce7d3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3a-dyn2.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + margin-bottom: 100px; +} +#negative { + margin-top: 0px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('negative').style.marginTop = '-80px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="positive"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3a.html b/layout/reftests/margin-collapsing/block-negative-3a.html new file mode 100644 index 000000000..06883fc39 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3a.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + margin-bottom: 100px; +} +#negative { + margin-top: -80px; +} +</style> +</head> +<body> +<div id="positive"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3b-dyn1.html b/layout/reftests/margin-collapsing/block-negative-3b-dyn1.html new file mode 100644 index 000000000..061667535 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3b-dyn1.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#negative { + margin-bottom: -80px; +} +#positive { + display: none; + margin-top: 100px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('positive').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="negative"></div> +<div id="positive"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3b-dyn2.html b/layout/reftests/margin-collapsing/block-negative-3b-dyn2.html new file mode 100644 index 000000000..02dc4c190 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3b-dyn2.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#negative { + margin-bottom: -80px; +} +#positive { + margin-top: 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('positive').style.marginTop = '100px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="negative"></div> +<div id="positive"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-3b.html b/layout/reftests/margin-collapsing/block-negative-3b.html new file mode 100644 index 000000000..cd39abdf9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-3b.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#negative { + margin-bottom: -80px; +} +#positive { + margin-top: 100px; +} +</style> +</head> +<body> +<div id="negative"></div> +<div id="positive"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4-noref1.html b/layout/reftests/margin-collapsing/block-negative-4-noref1.html new file mode 100644 index 000000000..47b9839b6 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4-noref1.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + background-color: blue; + margin-bottom: 40px; +} +</style> +</head> +<body> +<div id="positive"></div> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4-noref2.html b/layout/reftests/margin-collapsing/block-negative-4-noref2.html new file mode 100644 index 000000000..44365a259 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4-noref2.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +#positive, #negative { + height: 20px; + background-color: blue; +} +#margin { + height: 40px; +} +#negative { + background-color: green; +} +</style> +</head> +<body> +<div id="positive"></div> +<div id="margin"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4-ref.html b/layout/reftests/margin-collapsing/block-negative-4-ref.html new file mode 100644 index 000000000..5435cdd3b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + background-color: blue; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div id="positive"></div> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4-ref2.html b/layout/reftests/margin-collapsing/block-negative-4-ref2.html new file mode 100644 index 000000000..c7b53e3f7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4-ref2.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +#positive, #negative { + height: 20px; + background-color: blue; +} +#margin { + height: 10px; +} +#negative { + background-color: green; +} +</style> +</head> +<body> +<div id="positive"></div> +<div id="margin"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4a-dyn1.html b/layout/reftests/margin-collapsing/block-negative-4a-dyn1.html new file mode 100644 index 000000000..3e7fad7f8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4a-dyn1.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + margin-top: 30px; + margin-bottom: 40px; +} +#negative { + display: none; + margin-top: -90px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('negative').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="positive"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4a-dyn2.html b/layout/reftests/margin-collapsing/block-negative-4a-dyn2.html new file mode 100644 index 000000000..0cb75a5e7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4a-dyn2.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + margin-top: 30px; + margin-bottom: 40px; +} +#negative { + margin-top: 0; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('negative').style.marginTop = '-90px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="positive"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4a.html b/layout/reftests/margin-collapsing/block-negative-4a.html new file mode 100644 index 000000000..72ae66725 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4a.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#positive { + margin-top: 30px; + margin-bottom: 40px; +} +#negative { + margin-top: -90px; + background-color: blue; +} +</style> +</head> +<body> +<div id="positive"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4b-dyn1.html b/layout/reftests/margin-collapsing/block-negative-4b-dyn1.html new file mode 100644 index 000000000..333afaff3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4b-dyn1.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#negative { + margin-top: 30px; + margin-bottom: -90px; +} +#positive { + display: none; + margin-top: 40px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('positive').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="negative"></div> +<div id="positive"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4b-dyn2.html b/layout/reftests/margin-collapsing/block-negative-4b-dyn2.html new file mode 100644 index 000000000..31de8e29b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4b-dyn2.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#negative { + margin-top: 30px; + margin-bottom: -90px; +} +#positive { + margin-top: 0; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('positive').style.marginTop = '40px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="negative"></div> +<div id="positive"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-4b.html b/layout/reftests/margin-collapsing/block-negative-4b.html new file mode 100644 index 000000000..7c89014f6 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-4b.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#negative { + margin-top: 30px; + margin-bottom: -90px; +} +#positive { + margin-top: 40px; + background-color: blue; +} +</style> +</head> +<body> +<div id="negative"></div> +<div id="positive"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-5-dyn1.html b/layout/reftests/margin-collapsing/block-negative-5-dyn1.html new file mode 100644 index 000000000..df21c8680 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-5-dyn1.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#small { + margin-top: 40px; + margin-bottom: -40px; +} +#big { + display: none; + margin-top: -60px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('big').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="small"></div> +<div id="big"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-5-dyn2.html b/layout/reftests/margin-collapsing/block-negative-5-dyn2.html new file mode 100644 index 000000000..e42e714c2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-5-dyn2.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#small { + margin-top: 40px; + margin-bottom: -40px; +} +#big { + margin-top: 0; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('big').style.marginTop = '-60px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="small"></div> +<div id="big"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-5-noref1.html b/layout/reftests/margin-collapsing/block-negative-5-noref1.html new file mode 100644 index 000000000..d29106af9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-5-noref1.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#small { + margin-top: 40px; + margin-bottom: -40px; +} +#big { + background-color: blue; +} +</style> +</head> +<body> +<div id="small"></div> +<div id="big"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-5-noref2.html b/layout/reftests/margin-collapsing/block-negative-5-noref2.html new file mode 100644 index 000000000..ee397a4c2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-5-noref2.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; +} +#small { + background-color: green; +} +#big { + background-color: blue; +} +</style> +</head> +<body> +<div></div> +<div id="big"></div> +<div id="small"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-5-ref.html b/layout/reftests/margin-collapsing/block-negative-5-ref.html new file mode 100644 index 000000000..7a6713af3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-5-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#big { + background-color: blue; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div id="big"></div> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-5-ref2.html b/layout/reftests/margin-collapsing/block-negative-5-ref2.html new file mode 100644 index 000000000..8ba0aade7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-5-ref2.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; +} +#positive { + background-color: blue; +} +#negative { + background-color: green; +} +</style> +</head> +<body> +<div id="positive"></div> +<div></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-negative-5.html b/layout/reftests/margin-collapsing/block-negative-5.html new file mode 100644 index 000000000..f457a4148 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-negative-5.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 5px; +} +div { + height: 20px; + background-color: green; +} +#small { + margin-top: 40px; + margin-bottom: -40px; +} +#big { + margin-top: -60px; + background-color: blue; +} +</style> +</head> +<body> +<div id="small"></div> +<div id="big"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-1-ref.html b/layout/reftests/margin-collapsing/block-no-content-1-ref.html new file mode 100644 index 000000000..aba40bf1a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-1-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#margin-only { + height: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="margin-only"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-1a-dyn.html b/layout/reftests/margin-collapsing/block-no-content-1a-dyn.html new file mode 100644 index 000000000..e167d73c3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-1a-dyn.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('margin-only').style.margin = '10px 0 20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="margin-only"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-1a.html b/layout/reftests/margin-collapsing/block-no-content-1a.html new file mode 100644 index 000000000..baf0c2759 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-1a.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#margin-only { + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="margin-only"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-1b-dyn.html b/layout/reftests/margin-collapsing/block-no-content-1b-dyn.html new file mode 100644 index 000000000..d82839a6e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-1b-dyn.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('margin-only').style.margin = '20px 0 10px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="margin-only"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-1b.html b/layout/reftests/margin-collapsing/block-no-content-1b.html new file mode 100644 index 000000000..e1c6b8883 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-1b.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#margin-only { + margin-top: 20px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="margin-only"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-1c-dyn.html b/layout/reftests/margin-collapsing/block-no-content-1c-dyn.html new file mode 100644 index 000000000..fe8779634 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-1c-dyn.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('margin-only').style.margin = '20px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="margin-only"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-1c.html b/layout/reftests/margin-collapsing/block-no-content-1c.html new file mode 100644 index 000000000..748cfd7dd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-1c.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#margin-only { + margin-top: 20px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="margin-only"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-1d-dyn.html b/layout/reftests/margin-collapsing/block-no-content-1d-dyn.html new file mode 100644 index 000000000..2bb68ad77 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-1d-dyn.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('margin-only').style.margin = '60px 0 -40px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="margin-only"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-1d.html b/layout/reftests/margin-collapsing/block-no-content-1d.html new file mode 100644 index 000000000..63bb28eb4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-1d.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#margin-only { + margin-top: 60px; + margin-bottom: -40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="margin-only"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2-ref.html b/layout/reftests/margin-collapsing/block-no-content-2-ref.html new file mode 100644 index 000000000..a7235c8c2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#margin-only { + height: 40px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2a-dyn.html b/layout/reftests/margin-collapsing/block-no-content-2a-dyn.html new file mode 100644 index 000000000..c0339efc0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2a-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1 { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#margin-only { + margin-top: 20px; + margin-bottom: 30px; +} +#block2 { + height: 20px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('block2').style.marginTop = '40px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2a.html b/layout/reftests/margin-collapsing/block-no-content-2a.html new file mode 100644 index 000000000..72d5b22f9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2a.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#margin-only { + margin-top: 20px; + margin-bottom: 30px; +} +#block2 { + height: 20px; + margin-top: 40px; + background-color: green; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2b-dyn.html b/layout/reftests/margin-collapsing/block-no-content-2b-dyn.html new file mode 100644 index 000000000..a278a2d31 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2b-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1 { + height: 20px; + background-color: green; +} +#margin-only { + margin-top: 10px; + margin-bottom: 20px; +} +#block2 { + height: 20px; + margin-top: 30px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('block1').style.marginBottom = '40px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2b.html b/layout/reftests/margin-collapsing/block-no-content-2b.html new file mode 100644 index 000000000..f9e69aa6a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2b.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + height: 20px; + margin-bottom: 40px; + background-color: green; +} +#margin-only { + margin-top: 10px; + margin-bottom: 20px; +} +#block2 { + height: 20px; + margin-top: 30px; + background-color: green; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2c-dyn.html b/layout/reftests/margin-collapsing/block-no-content-2c-dyn.html new file mode 100644 index 000000000..212222d29 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2c-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1 { + height: 20px; + margin-bottom: 30px; + background-color: green; +} +#margin-only { + margin-bottom: 10px; +} +#block2 { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('margin-only').style.marginTop = '40px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2c.html b/layout/reftests/margin-collapsing/block-no-content-2c.html new file mode 100644 index 000000000..7978ca388 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2c.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + height: 20px; + margin-bottom: 30px; + background-color: green; +} +#margin-only { + margin-top: 40px; + margin-bottom: 10px; +} +#block2 { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2d-dyn.html b/layout/reftests/margin-collapsing/block-no-content-2d-dyn.html new file mode 100644 index 000000000..2c546d041 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2d-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1 { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +#margin-only { + margin-top: 30px; +} +#block2 { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('margin-only').style.marginBottom = '40px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2d.html b/layout/reftests/margin-collapsing/block-no-content-2d.html new file mode 100644 index 000000000..30dcb4985 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2d.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +#margin-only { + margin-top: 30px; + margin-bottom: 40px; +} +#block2 { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2e-dyn.html b/layout/reftests/margin-collapsing/block-no-content-2e-dyn.html new file mode 100644 index 000000000..d27fc524d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2e-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1 { + height: 20px; + background-color: green; +} +#margin-only { + margin-top: -40px; + margin-bottom: 20px; +} +#block2 { + height: 20px; + margin-top: -10px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('block1').style.marginBottom = '80px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-2e.html b/layout/reftests/margin-collapsing/block-no-content-2e.html new file mode 100644 index 000000000..bb0896d0d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-2e.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + height: 20px; + margin-bottom: 80px; + background-color: green; +} +#margin-only { + margin-top: -40px; + margin-bottom: 20px; +} +#block2 { + height: 20px; + margin-top: -10px; + background-color: green; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-3-ref.html b/layout/reftests/margin-collapsing/block-no-content-3-ref.html new file mode 100644 index 000000000..a5b22d433 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-3-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator, #parent { + height: 20px; + background-color: green; +} +#spacer { + height: 30px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="spacer"></div> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-3a-dyn.html b/layout/reftests/margin-collapsing/block-no-content-3a-dyn.html new file mode 100644 index 000000000..a74e8e402 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-3a-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#parent { + background-color: green; + margin-top: 10px; +} +#first-child { + margin-top: 20px; +} +#last-child { + height: 20px; + margin-top: 15px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.marginBottom = '30px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-3a.html b/layout/reftests/margin-collapsing/block-no-content-3a.html new file mode 100644 index 000000000..32933c2be --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-3a.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#parent { + background-color: green; + margin-top: 10px; +} +#first-child { + margin-top: 20px; + margin-bottom: 30px; +} +#last-child { + height: 20px; + margin-top: 15px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-3b-dyn.html b/layout/reftests/margin-collapsing/block-no-content-3b-dyn.html new file mode 100644 index 000000000..aae9c7165 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-3b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#parent { + background-color: green; + margin-top: -10px; +} +#first-child { + margin-bottom: 70px; +} +#last-child { + height: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.marginTop = '-40px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-3b.html b/layout/reftests/margin-collapsing/block-no-content-3b.html new file mode 100644 index 000000000..00f815163 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-3b.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#parent { + background-color: green; + margin-top: -10px; +} +#first-child { + margin-top: -40px; + margin-bottom: 70px; +} +#last-child { + height: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-3c-dyn.html b/layout/reftests/margin-collapsing/block-no-content-3c-dyn.html new file mode 100644 index 000000000..b4942b493 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-3c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#parent { + background-color: green; + margin-top: 90px; +} +#first-child { + margin-top: -40px; +} +#last-child { + height: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('first-child').style.marginBottom = '-60px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-3c.html b/layout/reftests/margin-collapsing/block-no-content-3c.html new file mode 100644 index 000000000..39ad02c62 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-3c.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator { + height: 20px; + background-color: green; +} +#parent { + background-color: green; + margin-top: 90px; +} +#first-child { + margin-top: -40px; + margin-bottom: -60px; +} +#last-child { + height: 20px; +} +</style> +</head> +<body> +<div id="separator"></div> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-4-ref.html b/layout/reftests/margin-collapsing/block-no-content-4-ref.html new file mode 100644 index 000000000..e3dc1c4e2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-4-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent, #separator { + height: 20px; + background-color: green; +} +#spacer { + height: 40px; +} +</style> +</head> +<body> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +<div id="spacer"></div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-4a-dyn.html b/layout/reftests/margin-collapsing/block-no-content-4a-dyn.html new file mode 100644 index 000000000..f8fe446d5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-4a-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + background-color: green; +} +#first-child { + height: 20px; + margin-bottom: 10px; +} +#last-child { + margin-top: 30px; +} +#separator { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.marginBottom = '40px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-4a.html b/layout/reftests/margin-collapsing/block-no-content-4a.html new file mode 100644 index 000000000..a10149767 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-4a.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: green; +} +#first-child { + height: 20px; + margin-bottom: 10px; +} +#last-child { + margin-top: 30px; + margin-bottom: 40px; +} +#separator { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-4b-dyn.html b/layout/reftests/margin-collapsing/block-no-content-4b-dyn.html new file mode 100644 index 000000000..d4fcf2c36 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-4b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + background-color: green; +} +#first-child { + height: 20px; +} +#last-child { + margin-top: 60px; +} +#separator { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.marginBottom = '-20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-4b.html b/layout/reftests/margin-collapsing/block-no-content-4b.html new file mode 100644 index 000000000..4faf50c21 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-4b.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: green; +} +#first-child { + height: 20px; +} +#last-child { + margin-top: 60px; + margin-bottom: -20px; +} +#separator { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-4c-dyn.html b/layout/reftests/margin-collapsing/block-no-content-4c-dyn.html new file mode 100644 index 000000000..2f5d81750 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-4c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + background-color: green; +} +#first-child { + height: 20px; +} +#last-child { + margin-top: -20px; +} +#separator { + height: 20px; + margin-top: 70px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('last-child').style.marginBottom = '-30px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-4c.html b/layout/reftests/margin-collapsing/block-no-content-4c.html new file mode 100644 index 000000000..0b6daef65 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-4c.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + background-color: green; +} +#first-child { + height: 20px; +} +#last-child { + margin-top: -20px; + margin-bottom: -30px; +} +#separator { + height: 20px; + margin-top: 70px; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="first-child"></div> + <div id="last-child"></div> +</div> +<div id="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-5-ref.html b/layout/reftests/margin-collapsing/block-no-content-5-ref.html new file mode 100644 index 000000000..df55ad542 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-5-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#child { + height: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-5a-dyn.html b/layout/reftests/margin-collapsing/block-no-content-5a-dyn.html new file mode 100644 index 000000000..699755aa6 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-5a-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + margin-top: 10px; + margin-bottom: 30px; +} +#child { + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('child').style.marginBottom = '40px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-5a.html b/layout/reftests/margin-collapsing/block-no-content-5a.html new file mode 100644 index 000000000..3926ecd29 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-5a.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + margin-top: 10px; + margin-bottom: 30px; +} +#child { + margin-top: 20px; + margin-bottom: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-5b-dyn.html b/layout/reftests/margin-collapsing/block-no-content-5b-dyn.html new file mode 100644 index 000000000..731094252 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-5b-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + margin-top: 60px; + margin-bottom: -30px; +} +#child { + margin-top: -20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('child').style.marginBottom = '70px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-5b.html b/layout/reftests/margin-collapsing/block-no-content-5b.html new file mode 100644 index 000000000..39814db73 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-5b.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#parent { + margin-top: 60px; + margin-bottom: -30px; +} +#child { + margin-top: -20px; + margin-bottom: 70px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="parent"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-6-dyn.html b/layout/reftests/margin-collapsing/block-no-content-6-dyn.html new file mode 100644 index 000000000..c870817e9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-6-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#spacer { + height: 40px; +} +#block1 { + height: 20px; + background-color: green; +} +#margin-only { + margin-bottom: -40px; +} +#block2 { + height: 20px; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('margin-only').style.marginTop = '-60px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="spacer"></div> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-6-ref.html b/layout/reftests/margin-collapsing/block-no-content-6-ref.html new file mode 100644 index 000000000..a982b3cbc --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-6-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + height: 20px; + background-color: green; +} +#margin-only { + height: 20px; +} +#block2 { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="spacer"></div> +<div id="block2"></div> +<div id="margin-only"></div> +<div id="block1"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-6.html b/layout/reftests/margin-collapsing/block-no-content-6.html new file mode 100644 index 000000000..3bc17bfa9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-6.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#spacer { + height: 40px; +} +#block1 { + height: 20px; + background-color: green; +} +#margin-only { + margin-top: -60px; + margin-bottom: -40px; +} +#block2 { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="spacer"></div> +<div id="block1"></div> +<div id="margin-only"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-7-dyn.html b/layout/reftests/margin-collapsing/block-no-content-7-dyn.html new file mode 100644 index 000000000..d15044269 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-7-dyn.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#bfc { + margin-top: 10px; + margin-bottom: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('bfc').style.overflow = 'hidden'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="bfc"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-7-ref.html b/layout/reftests/margin-collapsing/block-no-content-7-ref.html new file mode 100644 index 000000000..777047603 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-7-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#bfc { + height: 30px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="bfc"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-7.html b/layout/reftests/margin-collapsing/block-no-content-7.html new file mode 100644 index 000000000..4ededc1e2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-7.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#bfc { + margin-top: 10px; + margin-bottom: 20px; + overflow: hidden; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="bfc"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-8-dyn.html b/layout/reftests/margin-collapsing/block-no-content-8-dyn.html new file mode 100644 index 000000000..8eea3bb00 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-8-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + margin-top: 30px; + margin-bottom: 40px; + background-color: blue; +} +#zero-height { + margin-top: 20px; + margin-bottom: 60px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('min-height').style.minHeight = '20px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> + <div id="zero-height"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-8-ref.html b/layout/reftests/margin-collapsing/block-no-content-8-ref.html new file mode 100644 index 000000000..f2f666e9b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-8-ref.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#spacer1 { + height: 60px; +} +#min-height { + height: 20px; + background-color: blue; +} +#spacer2 { + height: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="spacer1"></div> +<div id="min-height"> + <div id="zero-height"></div> +</div> +<div id="spacer2"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-no-content-8.html b/layout/reftests/margin-collapsing/block-no-content-8.html new file mode 100644 index 000000000..23d703e9c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-no-content-8.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 20px; + margin-top: 30px; + margin-bottom: 40px; + background-color: blue; +} +#zero-height { + margin-top: 20px; + margin-bottom: 60px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> + <div id="zero-height"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1-ref.html b/layout/reftests/margin-collapsing/block-non-sibling-1-ref.html new file mode 100644 index 000000000..3ac1546ff --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; + height: 20px; +} +#b { + background-color: green; + height: 20px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1-ref2.html b/layout/reftests/margin-collapsing/block-non-sibling-1-ref2.html new file mode 100644 index 000000000..0a885f019 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1-ref2.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#positive, #negative { + background-color: green; + height: 20px; +} +#margin { + height: 40px; +} +</style> +</head> +<body> +<div id="positive"></div> +<div id="margin"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1a-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-1a-dyn.html new file mode 100644 index 000000000..fda3c7c49 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: green; + margin-top: 40px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1a.html b/layout/reftests/margin-collapsing/block-non-sibling-1a.html new file mode 100644 index 000000000..d35cf93da --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; +} +#a div { + height: 20px; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: green; + margin-top: 40px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1b-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-1b-dyn.html new file mode 100644 index 000000000..600a3213d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 40px; +} +#b { + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1b.html b/layout/reftests/margin-collapsing/block-non-sibling-1b.html new file mode 100644 index 000000000..5d03eb2cb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; +} +#a div { + height: 20px; + margin-bottom: 40px; +} +#b { + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1c-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-1c-dyn.html new file mode 100644 index 000000000..f29c171ce --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 10px; +} +#b { + height: 20px; + background-color: green; + margin-top: 40px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1c.html b/layout/reftests/margin-collapsing/block-non-sibling-1c.html new file mode 100644 index 000000000..c3f49d4b8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; +} +#a div { + height: 20px; + margin-bottom: 10px; +} +#b { + height: 20px; + background-color: green; + margin-top: 40px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1d-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-1d-dyn.html new file mode 100644 index 000000000..0aa57f79d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1d-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 40px; +} +#b { + height: 20px; + background-color: green; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1d.html b/layout/reftests/margin-collapsing/block-non-sibling-1d.html new file mode 100644 index 000000000..c80e54c4c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1d.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; +} +#a div { + height: 20px; + margin-bottom: 40px; +} +#b { + height: 20px; + background-color: green; + margin-top: 10px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1e-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-1e-dyn.html new file mode 100644 index 000000000..b82377ce0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1e-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 10px; +} +#b { + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1e.html b/layout/reftests/margin-collapsing/block-non-sibling-1e.html new file mode 100644 index 000000000..070634f35 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1e.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; +} +#a div { + height: 20px; + margin-bottom: 10px; +} +#b { + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1f-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-1f-dyn.html new file mode 100644 index 000000000..462b141da --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1f-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: green; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-1f.html b/layout/reftests/margin-collapsing/block-non-sibling-1f.html new file mode 100644 index 000000000..9fe0dfe4c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-1f.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; +} +#a div { + height: 20px; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: green; + margin-top: 10px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2-ref.html b/layout/reftests/margin-collapsing/block-non-sibling-2-ref.html new file mode 100644 index 000000000..3ac1546ff --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; + height: 20px; +} +#b { + background-color: green; + height: 20px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2-ref2.html b/layout/reftests/margin-collapsing/block-non-sibling-2-ref2.html new file mode 100644 index 000000000..0a885f019 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2-ref2.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#positive, #negative { + background-color: green; + height: 20px; +} +#margin { + height: 40px; +} +</style> +</head> +<body> +<div id="positive"></div> +<div id="margin"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2a-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-2a-dyn.html new file mode 100644 index 000000000..f7331cffe --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; + height: 20px; +} +#b { + background-color: green; + margin-top: 20px; +} +#b div { + display: none; + height: 20px; + margin-top: 40px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[2].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2a.html b/layout/reftests/margin-collapsing/block-non-sibling-2a.html new file mode 100644 index 000000000..9e39ade71 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; + height: 20px; +} +#b { + background-color: green; + margin-top: 20px; +} +#b div { + height: 20px; + margin-top: 40px; +} +</style> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2b-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-2b-dyn.html new file mode 100644 index 000000000..5b8ef2c63 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; + height: 20px; +} +#b { + background-color: green; + margin-top: 40px; +} +#b div { + display: none; + height: 20px; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[2].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2b.html b/layout/reftests/margin-collapsing/block-non-sibling-2b.html new file mode 100644 index 000000000..e62d647d4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; + height: 20px; +} +#b { + background-color: green; + margin-top: 40px; +} +#b div { + height: 20px; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2c-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-2c-dyn.html new file mode 100644 index 000000000..d024e33f1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; + height: 20px; +} +#b { + background-color: green; + margin-top: 10px; +} +#b div { + display: none; + height: 20px; + margin-top: 40px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[2].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2c.html b/layout/reftests/margin-collapsing/block-non-sibling-2c.html new file mode 100644 index 000000000..ea29ec58f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; + height: 20px; +} +#b { + background-color: green; + margin-top: 10px; +} +#b div { + height: 20px; + margin-top: 40px; +} +</style> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2d-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-2d-dyn.html new file mode 100644 index 000000000..f2afc1f9c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2d-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; + height: 20px; +} +#b { + background-color: green; + margin-top: 40px; +} +#b div { + display: none; + height: 20px; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[2].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2d.html b/layout/reftests/margin-collapsing/block-non-sibling-2d.html new file mode 100644 index 000000000..e9bcf3d2c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2d.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; + height: 20px; +} +#b { + background-color: green; + margin-top: 40px; +} +#b div { + height: 20px; + margin-top: 10px; +} +</style> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2e-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-2e-dyn.html new file mode 100644 index 000000000..fc04d808f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2e-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; + height: 20px; +} +#b { + background-color: green; + margin-top: 10px; +} +#b div { + display: none; + height: 20px; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[2].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2e.html b/layout/reftests/margin-collapsing/block-non-sibling-2e.html new file mode 100644 index 000000000..8bb4d2f0d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2e.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; + height: 20px; +} +#b { + background-color: green; + margin-top: 10px; +} +#b div { + height: 20px; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2f-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-2f-dyn.html new file mode 100644 index 000000000..50cd398a0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2f-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; + height: 20px; +} +#b { + background-color: green; + margin-top: 20px; +} +#b div { + display: none; + height: 20px; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[2].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-2f.html b/layout/reftests/margin-collapsing/block-non-sibling-2f.html new file mode 100644 index 000000000..30a1a5930 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-2f.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; + height: 20px; +} +#b { + background-color: green; + margin-top: 20px; +} +#b div { + height: 20px; + margin-top: 10px; +} +</style> +</head> +<body> +<div id="a"> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3-ref.html b/layout/reftests/margin-collapsing/block-non-sibling-3-ref.html new file mode 100644 index 000000000..032af5734 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 80px; + height: 20px; +} +#b { + background-color: green; + height: 20px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3-ref2.html b/layout/reftests/margin-collapsing/block-non-sibling-3-ref2.html new file mode 100644 index 000000000..834bc9c63 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3-ref2.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#positive, #negative { + background-color: green; + height: 20px; +} +#margin { + height: 80px; +} +</style> +</head> +<body> +<div id="positive"></div> +<div id="margin"></div> +<div id="negative"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3a-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-3a-dyn.html new file mode 100644 index 000000000..8efe55b7e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3a-dyn.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 20px; +} +#b { + background-color: green; + margin-top: 40px; +} +#b div { + display: none; + height: 20px; + margin-top: 80px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.getElementsByTagName('div')[3].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3a.html b/layout/reftests/margin-collapsing/block-non-sibling-3a.html new file mode 100644 index 000000000..73d535107 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3a.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 10px; +} +#a div { + height: 20px; + margin-bottom: 20px; +} +#b { + background-color: green; + margin-top: 40px; +} +#b div { + height: 20px; + margin-top: 80px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3b-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-3b-dyn.html new file mode 100644 index 000000000..ce97f5fb8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3b-dyn.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 80px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 10px; +} +#b { + background-color: green; + margin-top: 20px; +} +#b div { + display: none; + height: 20px; + margin-top: 40px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.getElementsByTagName('div')[3].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3b.html b/layout/reftests/margin-collapsing/block-non-sibling-3b.html new file mode 100644 index 000000000..08e7aa1cb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3b.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 80px; +} +#a div { + height: 20px; + margin-bottom: 10px; +} +#b { + background-color: green; + margin-top: 20px; +} +#b div { + height: 20px; + margin-top: 40px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3c-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-3c-dyn.html new file mode 100644 index 000000000..a1766495a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3c-dyn.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 80px; +} +#b { + background-color: green; + margin-top: 10px; +} +#b div { + display: none; + height: 20px; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.getElementsByTagName('div')[3].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3c.html b/layout/reftests/margin-collapsing/block-non-sibling-3c.html new file mode 100644 index 000000000..8fe9f627f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3c.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 40px; +} +#a div { + height: 20px; + margin-bottom: 80px; +} +#b { + background-color: green; + margin-top: 10px; +} +#b div { + height: 20px; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3d-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-3d-dyn.html new file mode 100644 index 000000000..b14c562f3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3d-dyn.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; +} +#a div { + display: none; + height: 20px; + margin-bottom: 40px; +} +#b { + background-color: green; + margin-top: 80px; +} +#b div { + display: none; + height: 20px; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('div')[1].style.display = 'block'; + document.getElementsByTagName('div')[3].style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-3d.html b/layout/reftests/margin-collapsing/block-non-sibling-3d.html new file mode 100644 index 000000000..60214d791 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-3d.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + margin-bottom: 20px; +} +#a div { + height: 20px; + margin-bottom: 40px; +} +#b { + background-color: green; + margin-top: 80px; +} +#b div { + height: 20px; + margin-top: 10px; +} +</style> +</head> +<body> +<div id="a"> + <div></div> +</div> +<div id="b"> + <div></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-4-dyn.html b/layout/reftests/margin-collapsing/block-non-sibling-4-dyn.html new file mode 100644 index 000000000..513639bc2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-4-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#bar1 { + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#none { + height: 20px; + background-color: red; + margin-top: 30px; + margin-bottom: 40px; +} +#bar2 { + height: 20px; + background-color: blue; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('none').style.display = 'none'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="bar1"></div> +<div id="none"></div> +<div id="bar2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-4-ref.html b/layout/reftests/margin-collapsing/block-non-sibling-4-ref.html new file mode 100644 index 000000000..e9ef9a691 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-4-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#bar1 { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#bar2 { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="bar1"></div> +<div id="bar2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-4-ref2.html b/layout/reftests/margin-collapsing/block-non-sibling-4-ref2.html new file mode 100644 index 000000000..37ca89286 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-4-ref2.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#bar1 { + background-color: green; +} +div { + height: 20px; +} +#bar2 { + background-color: blue; +} +</style> +</head> +<body> +<div id="bar1"></div> +<div></div> +<div id="bar2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-non-sibling-4.html b/layout/reftests/margin-collapsing/block-non-sibling-4.html new file mode 100644 index 000000000..2db477167 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-non-sibling-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#bar1 { + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#none { + display: none; + height: 20px; + background-color: red; + margin-top: 30px; + margin-bottom: 40px; +} +#bar2 { + height: 20px; + background-color: blue; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="bar1"></div> +<div id="none"></div> +<div id="bar2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-1-dyn.html b/layout/reftests/margin-collapsing/block-overflow-1-dyn.html new file mode 100644 index 000000000..5981abdbb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-1-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + overflow: hidden; + margin: 20px 0; + background-color: lightgreen; +} +#child { + height: 200px; + margin: 40px 0; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('overflow').style.overflow = 'visible'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-1-ref.html b/layout/reftests/margin-collapsing/block-overflow-1-ref.html new file mode 100644 index 000000000..bc8e09a03 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-1-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow-child { + height: 200px; + margin: 40px 0; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="overflow-child"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-1-ref2.html b/layout/reftests/margin-collapsing/block-overflow-1-ref2.html new file mode 100644 index 000000000..d2b7a4f5d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-1-ref2.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +.spacer { + height: 40px; +} +#overflow { + height: 200px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div class="spacer"></div> +<div id="overflow"></div> +<div class="spacer"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-1.html b/layout/reftests/margin-collapsing/block-overflow-1.html new file mode 100644 index 000000000..23090df96 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-1.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + overflow: visible; + margin: 20px 0; + background-color: lightgreen; +} +#child { + height: 200px; + margin: 40px 0; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-2-dyn.html b/layout/reftests/margin-collapsing/block-overflow-2-dyn.html new file mode 100644 index 000000000..7fee2a812 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-2-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + height: 200px; + margin: 20px 0; + background-color: lightgreen; +} +#child { + height: 160px; + margin: 40px 0; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('overflow').style.overflow = 'hidden'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-2-ref.html b/layout/reftests/margin-collapsing/block-overflow-2-ref.html new file mode 100644 index 000000000..2134c8491 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-2-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + margin: 20px 0; + padding-top: 40px; + background-color: lightgreen; +} +#child { + height: 160px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-2-ref2.html b/layout/reftests/margin-collapsing/block-overflow-2-ref2.html new file mode 100644 index 000000000..5698c631f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-2-ref2.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +.spacer { + height: 20px; +} +#margin { + height: 40px; + background-color: lightgreen; +} +#child { + height: 160px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div class="spacer"></div> +<div> + <div id="margin"></div> + <div id="child"></div> +</div> +<div class="spacer"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-2.html b/layout/reftests/margin-collapsing/block-overflow-2.html new file mode 100644 index 000000000..a980d3dcd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + overflow: hidden; + height: 200px; + margin: 20px 0; + background-color: lightgreen; +} +#child { + height: 160px; + margin: 40px 0; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-3-dyn.html b/layout/reftests/margin-collapsing/block-overflow-3-dyn.html new file mode 100644 index 000000000..0f2b64687 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-3-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + overflow-y: visible; + height: 200px; + margin: 20px 0; + background-color: lightgreen; +} +#child { + height: 160px; + margin: 40px 0; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('overflow').style.overflowY = 'scroll'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-3-ref.html b/layout/reftests/margin-collapsing/block-overflow-3-ref.html new file mode 100644 index 000000000..d793991ce --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-3-ref.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + overflow-y: scroll; + height: 160px; + margin: 20px 0; + padding-top: 40px; + background-color: lightgreen; +} +#child { + height: 160px; + background-color: green; +} +#margin { + height: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> + <div id="margin"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-3-ref2.html b/layout/reftests/margin-collapsing/block-overflow-3-ref2.html new file mode 100644 index 000000000..ce8bf5784 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-3-ref2.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +.spacer { + height: 20px; +} +#overflow { + overflow-y: scroll; + height: 200px; + background-color: lightgreen; +} +.margin { + height: 40px; +} +#child { + height: 160px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div class="spacer"></div> +<div id="overflow"> + <div class="margin"></div> + <div id="child"></div> + <div class="margin"></div> +</div> +<div class="spacer"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-3.html b/layout/reftests/margin-collapsing/block-overflow-3.html new file mode 100644 index 000000000..201cc9eb7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + overflow-y: scroll; + height: 200px; + margin: 20px 0; + background-color: lightgreen; +} +#child { + height: 160px; + margin: 40px 0; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-4-dyn.html b/layout/reftests/margin-collapsing/block-overflow-4-dyn.html new file mode 100644 index 000000000..e8d49258d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-4-dyn.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + overflow: visible; + height: 200px; + margin: 20px 0; + background-color: lightgreen; +} +#child { + height: 160px; + margin: 40px 0; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('overflow').style.overflow = 'auto'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-4-ref.html b/layout/reftests/margin-collapsing/block-overflow-4-ref.html new file mode 100644 index 000000000..7bd228b68 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-4-ref.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + overflow: auto; + height: 160px; + margin: 20px 0; + padding-top: 40px; + background-color: lightgreen; +} +#child { + height: 160px; + background-color: green; +} +#margin { + height: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> + <div id="margin"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-4-ref2.html b/layout/reftests/margin-collapsing/block-overflow-4-ref2.html new file mode 100644 index 000000000..be8f26fd1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-4-ref2.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +.spacer { + height: 20px; +} +#overflow { + overflow-y: auto; + height: 200px; + background-color: lightgreen; +} +.margin { + height: 40px; +} +#child { + height: 160px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div class="spacer"></div> +<div id="overflow"> + <div class="margin"></div> + <div id="child"></div> + <div class="margin"></div> +</div> +<div class="spacer"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-4.html b/layout/reftests/margin-collapsing/block-overflow-4.html new file mode 100644 index 000000000..ea6b271dd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-4.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#overflow { + overflow: auto; + height: 200px; + margin: 20px 0; + background-color: lightgreen; +} +#child { + height: 160px; + margin: 40px 0; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="overflow"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5-ref.html b/layout/reftests/margin-collapsing/block-overflow-5-ref.html new file mode 100644 index 000000000..1a9eac26a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +#overflow { + background-color: green; + height: 40px; +} +#separator-bottom { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5-ref2.html b/layout/reftests/margin-collapsing/block-overflow-5-ref2.html new file mode 100644 index 000000000..4115be80c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5-ref2.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +.margin { + height: 20px; +} +#overflow { + overflow: visible; + height: 40px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div class="margin"></div> +<div id="overflow"></div> +<div class="margin"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5a-dyn.html b/layout/reftests/margin-collapsing/block-overflow-5a-dyn.html new file mode 100644 index 000000000..8e0607619 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#overflow { + overflow: scroll; + height: 40px; + margin: 20px 0; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('overflow').style.overflow = 'visible'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5a.html b/layout/reftests/margin-collapsing/block-overflow-5a.html new file mode 100644 index 000000000..1eeb383ae --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5a.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#overflow { + overflow: visible; + height: 40px; + margin: 20px 0; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5b-dyn.html b/layout/reftests/margin-collapsing/block-overflow-5b-dyn.html new file mode 100644 index 000000000..3c041d868 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#overflow { + overflow: scroll; + height: 40px; + margin: 20px 0; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('overflow').style.overflow = 'hidden'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5b.html b/layout/reftests/margin-collapsing/block-overflow-5b.html new file mode 100644 index 000000000..e4020070b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5b.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#overflow { + overflow: hidden; + height: 40px; + margin: 20px 0; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5c-dyn.html b/layout/reftests/margin-collapsing/block-overflow-5c-dyn.html new file mode 100644 index 000000000..731f2fa60 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5c-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#overflow { + height: 40px; + margin: 20px 0; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('overflow').style.overflowY = 'scroll'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5c-ref.html b/layout/reftests/margin-collapsing/block-overflow-5c-ref.html new file mode 100644 index 000000000..b09be0f1c --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5c-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +#overflow { + overflow-y: scroll; + height: 40px; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5c-ref2.html b/layout/reftests/margin-collapsing/block-overflow-5c-ref2.html new file mode 100644 index 000000000..89558cfa4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5c-ref2.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +.margin { + height: 20px; +} +#overflow { + overflow-y: scroll; + height: 40px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div class="margin"></div> +<div id="overflow"></div> +<div class="margin"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5c.html b/layout/reftests/margin-collapsing/block-overflow-5c.html new file mode 100644 index 000000000..113c172b4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5c.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#overflow { + overflow-y: scroll; + height: 40px; + margin: 20px 0; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5d-dyn.html b/layout/reftests/margin-collapsing/block-overflow-5d-dyn.html new file mode 100644 index 000000000..cd5a969d4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5d-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#overflow { + overflow: scroll; + height: 40px; + margin: 20px 0; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('overflow').style.overflow = 'auto'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-overflow-5d.html b/layout/reftests/margin-collapsing/block-overflow-5d.html new file mode 100644 index 000000000..efbeafe00 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-overflow-5d.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +#overflow { + overflow: auto; + height: 40px; + margin: 20px 0; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +</head> +<body> +<div id="separator-top"></div> +<div id="overflow"></div> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-percent-1-dyn.html b/layout/reftests/margin-collapsing/block-percent-1-dyn.html new file mode 100644 index 000000000..780e95a72 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-percent-1-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + width: 200px; +} +#block1 { + height: 40px; + margin-bottom: 10%; + background-color: green; +} +#block2 { + height: 40px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('block2').style.marginTop = '25%'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="block1"></div> + <div id="block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-percent-1-ref.html b/layout/reftests/margin-collapsing/block-percent-1-ref.html new file mode 100644 index 000000000..a60812bc0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-percent-1-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + width: 200px; height: 40px; + margin-bottom: 50px; + background-color: green; +} +#block2 { + width: 200px; height: 40px; + background-color: green; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-percent-1.html b/layout/reftests/margin-collapsing/block-percent-1.html new file mode 100644 index 000000000..3344bd0b2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-percent-1.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + width: 200px; +} +#block1 { + height: 40px; + margin-bottom: 10%; + background-color: green; +} +#block2 { + height: 40px; + margin-top: 25%; + background-color: green; +} +</style> +</head> +<body> +<div id="parent"> + <div id="block1"></div> + <div id="block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-percent-2-dyn.html b/layout/reftests/margin-collapsing/block-percent-2-dyn.html new file mode 100644 index 000000000..c0e5607d9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-percent-2-dyn.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent1 { + width: 200px; +} +#block1 { + height: 50px; + margin-bottom: 20%; + background-color: green; +} +#parent2 { + width: 200px; +} +#block2 { + height: 50px; + margin-top: 10%; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('parent2').style.width = '500px'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent1"> + <div id="block1"></div> +</div> +<div id="parent2"> + <div id="block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-percent-2-ref.html b/layout/reftests/margin-collapsing/block-percent-2-ref.html new file mode 100644 index 000000000..d9efe6bfb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-percent-2-ref.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent1 { + width: 200px; +} +#block1 { + height: 50px; + background-color: green; +} +#parent2 { + width: 500px; +} +#block2 { + height: 50px; + background-color: green; +} +#spacer { + height: 50px; +} +</style> +</head> +<body> +<div id="parent1"> + <div id="block1"></div> +</div> +<div id="spacer"></div> +<div id="parent2"> + <div id="block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-percent-2.html b/layout/reftests/margin-collapsing/block-percent-2.html new file mode 100644 index 000000000..0137dc9b9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-percent-2.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent1 { + width: 200px; +} +#block1 { + height: 50px; + margin-bottom: 20%; + background-color: green; +} +#parent2 { + width: 500px; +} +#block2 { + height: 50px; + margin-top: 10%; + background-color: green; +} +</style> +</head> +<body> +<div id="parent1"> + <div id="block1"></div> +</div> +<div id="parent2"> + <div id="block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-root-1a-noref1.html b/layout/reftests/margin-collapsing/block-root-1a-noref1.html new file mode 100644 index 000000000..a04466cb8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-root-1a-noref1.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html { + margin: 0px; padding: 0; + background-color: green; +} +body { + margin: 0px; padding: 0; +} +div { + margin: 20px 40px; + background-color: blue; + height: 20px; +} +</style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-root-1a-noref2.html b/layout/reftests/margin-collapsing/block-root-1a-noref2.html new file mode 100644 index 000000000..53041a688 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-root-1a-noref2.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html { + margin: 0px; padding: 0; + background-color: green; +} +body { + margin: 0px; padding: 0; +} +div { + margin: 40px 20px; + background-color: blue; + height: 20px; +} +</style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-root-1a-ref.html b/layout/reftests/margin-collapsing/block-root-1a-ref.html new file mode 100644 index 000000000..6906ed3aa --- /dev/null +++ b/layout/reftests/margin-collapsing/block-root-1a-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html { + margin: 40px; padding: 0; + background-color: green; +} +body { + margin: 0px; padding: 0; + background-color: blue; + height: 20px; +} +</style> +</head> +<body> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-root-1a-ref2.html b/layout/reftests/margin-collapsing/block-root-1a-ref2.html new file mode 100644 index 000000000..bbf8f02cd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-root-1a-ref2.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0px; padding: 0; + background-color: green; +} +div { + margin: 40px; + background-color: blue; + height: 20px; +} +</style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-root-1a.html b/layout/reftests/margin-collapsing/block-root-1a.html new file mode 100644 index 000000000..70781b9c7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-root-1a.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html { + margin: 20px; padding: 0; + background-color: green; +} +body { + margin: 20px; padding: 0; + background-color: blue; + height: 20px; +} +</style> +</head> +<body> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-root-1b-ref.html b/layout/reftests/margin-collapsing/block-root-1b-ref.html new file mode 100644 index 000000000..fe648e601 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-root-1b-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html { + margin: 0; padding: 40px 20px; + background-color: green; +} +body { + margin: 0; padding: 0 20px; + background-color: red; +} +div { + background-color: blue; + height: 20px; +} +</style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-root-1b-ref2.html b/layout/reftests/margin-collapsing/block-root-1b-ref2.html new file mode 100644 index 000000000..7ae45e0df --- /dev/null +++ b/layout/reftests/margin-collapsing/block-root-1b-ref2.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin: 0; padding: 0; + background-color: green; +} +div { + margin: 40px 20px; padding: 0 20px; + background-color: red; + height: 20px; +} +div div { + margin: 0; padding: 0; + background-color: blue; +} +</style> +</head> +<body> +<div><div></div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-root-1b.html b/layout/reftests/margin-collapsing/block-root-1b.html new file mode 100644 index 000000000..c8e6bea1d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-root-1b.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html { + margin: 20px; padding: 0; + background-color: green; +} +body { + margin: 0; padding: 0; + background-color: red; +} +div { + margin: 20px; + background-color: blue; + height: 20px; +} +</style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1-noref.html b/layout/reftests/margin-collapsing/block-sibling-1-noref.html new file mode 100644 index 000000000..4b123d947 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1-noref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#sibling1 { + height: 20px; + background-color: green; + margin-bottom: 30px; +} +#sibling2 { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="sibling1"></div> +<div id="sibling2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1-noref2.html b/layout/reftests/margin-collapsing/block-sibling-1-noref2.html new file mode 100644 index 000000000..96a2f6b10 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1-noref2.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#sibling1 { + height: 20px; + background-color: green; + margin-bottom: 40px; +} +#sibling2 { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="sibling1"></div> +<div id="sibling2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1-ref.html b/layout/reftests/margin-collapsing/block-sibling-1-ref.html new file mode 100644 index 000000000..7c5c4e732 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1-ref2.html b/layout/reftests/margin-collapsing/block-sibling-1-ref2.html new file mode 100644 index 000000000..e413c50ee --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1-ref2.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#margin { + height: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="margin"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1a-dyn.html b/layout/reftests/margin-collapsing/block-sibling-1a-dyn.html new file mode 100644 index 000000000..195d3a63a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1a-dyn.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#sibling1 { + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#sibling2 { + display: none; + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('sibling2').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="sibling1"></div> +<div id="sibling2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1a.html b/layout/reftests/margin-collapsing/block-sibling-1a.html new file mode 100644 index 000000000..a0f9cfcf9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1a.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#b { + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1b-dyn.html b/layout/reftests/margin-collapsing/block-sibling-1b-dyn.html new file mode 100644 index 000000000..4360cb6b8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1b-dyn.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#sibling1 { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#sibling2 { + display: none; + height: 20px; + background-color: green; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('sibling2').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="sibling1"></div> +<div id="sibling2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1b.html b/layout/reftests/margin-collapsing/block-sibling-1b.html new file mode 100644 index 000000000..051b046c0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1b.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: green; + margin-top: 10px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1c-dyn.html b/layout/reftests/margin-collapsing/block-sibling-1c-dyn.html new file mode 100644 index 000000000..27f615993 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1c-dyn.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#sibling1 { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#sibling2 { + display: none; + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('sibling2').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="sibling1"></div> +<div id="sibling2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-1c.html b/layout/reftests/margin-collapsing/block-sibling-1c.html new file mode 100644 index 000000000..842a698f8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-1c.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-2-dyn.html b/layout/reftests/margin-collapsing/block-sibling-2-dyn.html new file mode 100644 index 000000000..0b710d964 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-2-dyn.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#sibling1 { + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#sibling2 { + display: none; + height: 20px; + background-color: blue; + margin-top: 10px; + margin-bottom: 10px; + position: relative; + top: 40px; +} +#sibling3 { + height: 20px; + background-color: green; + margin-top: 20px; + position: relative; + top: -40px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('sibling2').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="sibling1"></div> +<div id="sibling2"></div> +<div id="sibling3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-2-noref.html b/layout/reftests/margin-collapsing/block-sibling-2-noref.html new file mode 100644 index 000000000..5a687e9a5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-2-noref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: red; + margin-bottom: 40px; +} +#b { + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#c { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +<div id="c"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-2-ref.html b/layout/reftests/margin-collapsing/block-sibling-2-ref.html new file mode 100644 index 000000000..dbe785d27 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-2-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#c { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +<div id="c"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-2-ref2.html b/layout/reftests/margin-collapsing/block-sibling-2-ref2.html new file mode 100644 index 000000000..3b32ed57b --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-2-ref2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#red { + height: 20px; + background-color: red; +} +#green { + height: 20px; + background-color: green; +} +#blue { + height: 20px; + background-color: blue; +} +.margin { + height: 20px; +} +</style> +</head> +<body> +<div id="red"></div> +<div class="margin"></div> +<div id="green"></div> +<div class="margin"></div> +<div id="blue"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-2.html b/layout/reftests/margin-collapsing/block-sibling-2.html new file mode 100644 index 000000000..9dc60df51 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-2.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#b { + height: 20px; + background-color: blue; + margin-top: 10px; + margin-bottom: 10px; + position: relative; + top: 40px; +} +#c { + height: 20px; + background-color: green; + margin-top: 20px; + position: relative; + top: -40px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +<div id="c"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-3-dyn.html b/layout/reftests/margin-collapsing/block-sibling-3-dyn.html new file mode 100644 index 000000000..4303a3445 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-3-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#sibling1 { + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#sibling2 { + height: 20px; + background-color: green; + margin-top: 20px; + margin-bottom: 20px; +} +#sibling3 { + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('sibling2').style.display = 'none'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="sibling1"></div> +<div id="sibling2"></div> +<div id="sibling3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-sibling-3.html b/layout/reftests/margin-collapsing/block-sibling-3.html new file mode 100644 index 000000000..4156e6fe1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-sibling-3.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#sibling1 { + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#sibling2 { + display: none; + height: 20px; + background-color: green; + margin-top: 20px; + margin-bottom: 10px; +} +#sibling3 { + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="sibling1"></div> +<div id="sibling2"></div> +<div id="sibling3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-1-ref.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-1-ref.xhtml new file mode 100644 index 000000000..9ee488fd5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-1-ref.xhtml @@ -0,0 +1,22 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + html, body { + background-color: white; + margin: 0; padding: 0; + } + #the-html { + padding: 30px 0; + } + #the-body { + background-color: green; + height: 100px; + } + </style> +</head> +<body> +<div id="the-html"> + <div id="the-body"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-1a-dyn.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-1a-dyn.xhtml new file mode 100644 index 000000000..e0c87723e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-1a-dyn.xhtml @@ -0,0 +1,28 @@ +<html xmlns="http://www.w3.org/1999/xhtml" class="reftest-wait"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 20px 0; + } + body { + display: none; + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> + <script type="text/javascript"> + function test() { + document.getElementsByTagName('body')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); + } + document.addEventListener('MozReftestInvalidate', test, false); + </script> +</head> +<body> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-1a.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-1a.xhtml new file mode 100644 index 000000000..bad10d858 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-1a.xhtml @@ -0,0 +1,20 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 20px 0; + } + body { + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> +</head> +<body> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-1b-dyn.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-1b-dyn.xhtml new file mode 100644 index 000000000..ea0321bf6 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-1b-dyn.xhtml @@ -0,0 +1,29 @@ +<html xmlns="http://www.w3.org/1999/xhtml" class="reftest-wait"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 20px 0; + } + div { + display: none; + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> + <script type="text/javascript"> + function test() { + document.getElementsByTagName('div')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); + } + document.addEventListener('MozReftestInvalidate', test, false); + </script> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-1b.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-1b.xhtml new file mode 100644 index 000000000..9661768c1 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-1b.xhtml @@ -0,0 +1,21 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 20px 0; + } + div { + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-2-dyn.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-2-dyn.xhtml new file mode 100644 index 000000000..a2b18e0db --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-2-dyn.xhtml @@ -0,0 +1,32 @@ +<html xmlns="http://www.w3.org/1999/xhtml" class="reftest-wait"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + } + body { + background-color: red; + margin: 20px 0; + } + div { + display: none; + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> + <script type="text/javascript"> + function test() { + document.getElementsByTagName('div')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); + } + document.addEventListener('MozReftestInvalidate', test, false); + </script> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-2-ref.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-2-ref.xhtml new file mode 100644 index 000000000..4c5e41d55 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-2-ref.xhtml @@ -0,0 +1,27 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + html, body, div { + margin: 0; padding: 0; + background-color: white; + } + #the-html { + padding: 20px 0; + } + #the-body { + background-color: red; + } + #the-div { + background-color: green; + height: 100px; + } + </style> +</head> +<body> +<div id="the-html"> + <div id="the-body"> + <div id="the-div"></div> + </div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-2.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-2.xhtml new file mode 100644 index 000000000..72ab87bec --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-2.xhtml @@ -0,0 +1,24 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + } + body { + background-color: red; + margin: 20px 0; + } + div { + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-3-dyn.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-3-dyn.xhtml new file mode 100644 index 000000000..514050f08 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-3-dyn.xhtml @@ -0,0 +1,33 @@ +<html xmlns="http://www.w3.org/1999/xhtml" class="reftest-wait"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 10px 0; + } + body { + background-color: red; + margin: 20px 0; + } + div { + display: none; + background-color: green; + margin: 40px 0; + height: 100px; + } + </style> + <script type="text/javascript"> + function test() { + document.getElementsByTagName('div')[0].style.display = 'block'; + document.documentElement.removeAttribute('class'); + } + document.addEventListener('MozReftestInvalidate', test, false); + </script> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-3-ref.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-3-ref.xhtml new file mode 100644 index 000000000..48081fffd --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-3-ref.xhtml @@ -0,0 +1,27 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + html, body, div { + margin: 0; padding: 0; + background-color: white; + } + #the-html { + padding: 50px 0; + } + #the-body { + background-color: red; + } + #the-div { + background-color: green; + height: 100px; + } + </style> +</head> +<body> +<div id="the-html"> + <div id="the-body"> + <div id="the-div"></div> + </div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-html-3.xhtml b/layout/reftests/margin-collapsing/block-xhtml-html-3.xhtml new file mode 100644 index 000000000..53862af80 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-html-3.xhtml @@ -0,0 +1,25 @@ +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + html, body { + margin: 0; padding: 0; + } + html { + background-color: white; + margin: 10px 0; + } + body { + background-color: red; + margin: 20px 0; + } + div { + background-color: green; + margin: 40px 0; + height: 100px; + } + </style> +</head> +<body> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-xhtml-root-1-ref.xhtml b/layout/reftests/margin-collapsing/block-xhtml-root-1-ref.xhtml new file mode 100644 index 000000000..2ef19cbb3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-root-1-ref.xhtml @@ -0,0 +1,24 @@ +<root> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + root, html, body { + display: block; + margin: 0; padding: 0; + } + #the-root { + padding: 30px 0; + } + #the-html { + background-color: green; + height: 100px; + } + </style> +</head> +<body> +<div id="the-root"> + <div id="the-html"></div> +</div> +</body> +</html> +</root> diff --git a/layout/reftests/margin-collapsing/block-xhtml-root-1a.xhtml b/layout/reftests/margin-collapsing/block-xhtml-root-1a.xhtml new file mode 100644 index 000000000..50d476bdc --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-root-1a.xhtml @@ -0,0 +1,20 @@ +<root> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + root, html { + display: block; + margin: 0; padding: 0; + } + root { + margin: 20px 0; + } + html { + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> +</head> +</html> +</root> diff --git a/layout/reftests/margin-collapsing/block-xhtml-root-1b.xhtml b/layout/reftests/margin-collapsing/block-xhtml-root-1b.xhtml new file mode 100644 index 000000000..fe2668163 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-root-1b.xhtml @@ -0,0 +1,22 @@ +<root> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + root, html, body { + display: block; + margin: 0; padding: 0; + } + root { + margin: 20px 0; + } + body { + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> +</head> +<body> +</body> +</html> +</root> diff --git a/layout/reftests/margin-collapsing/block-xhtml-root-2-ref.xhtml b/layout/reftests/margin-collapsing/block-xhtml-root-2-ref.xhtml new file mode 100644 index 000000000..148aa1ab5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-root-2-ref.xhtml @@ -0,0 +1,29 @@ +<root> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + root, html, body { + display: block; + margin: 0; padding: 0; + } + #the-root { + padding: 20px 0; + } + #the-html { + background-color: lightgreen; + } + #the-body { + background-color: green; + height: 100px; + } + </style> +</head> +<body> +<div id="the-root"> + <div id="the-html"> + <div id="the-body"></div> + </div> +</div> +</body> +</html> +</root> diff --git a/layout/reftests/margin-collapsing/block-xhtml-root-2.xhtml b/layout/reftests/margin-collapsing/block-xhtml-root-2.xhtml new file mode 100644 index 000000000..5d71978e2 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-root-2.xhtml @@ -0,0 +1,23 @@ +<root> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + root, html, body { + display: block; + margin: 0; padding: 0; + } + html { + background-color: lightgreen; + margin: 20px 0; + } + body { + background-color: green; + margin: 10px 0; + height: 100px; + } + </style> +</head> +<body> +</body> +</html> +</root> diff --git a/layout/reftests/margin-collapsing/block-xhtml-root-3-ref.xhtml b/layout/reftests/margin-collapsing/block-xhtml-root-3-ref.xhtml new file mode 100644 index 000000000..2771c87ca --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-root-3-ref.xhtml @@ -0,0 +1,29 @@ +<root> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + root, html, body { + display: block; + margin: 0; padding: 0; + } + #the-root { + padding: 50px 0; + } + #the-html { + background-color: lightgreen; + } + #the-body { + background-color: green; + height: 100px; + } + </style> +</head> +<body> +<div id="the-root"> + <div id="the-html"> + <div id="the-body"></div> + </div> +</div> +</body> +</html> +</root> diff --git a/layout/reftests/margin-collapsing/block-xhtml-root-3.xhtml b/layout/reftests/margin-collapsing/block-xhtml-root-3.xhtml new file mode 100644 index 000000000..bf94b4d23 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xhtml-root-3.xhtml @@ -0,0 +1,26 @@ +<root> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> + <style type="text/css"> + root, html, body { + display: block; + margin: 0; padding: 0; + } + root { + margin: 10px 0; + } + html { + background-color: lightgreen; + margin: 20px 0; + } + body { + background-color: green; + margin: 40px 0; + height: 100px; + } + </style> +</head> +<body> +</body> +</html> +</root> diff --git a/layout/reftests/margin-collapsing/block-xml-root-1-ref.css b/layout/reftests/margin-collapsing/block-xml-root-1-ref.css new file mode 100644 index 000000000..346f63a2f --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xml-root-1-ref.css @@ -0,0 +1,9 @@ +root { + display: block; + padding: 30px 0; +} +leaf { + display: block; + background-color: green; + height: 100px; +} diff --git a/layout/reftests/margin-collapsing/block-xml-root-1-ref.xml b/layout/reftests/margin-collapsing/block-xml-root-1-ref.xml new file mode 100644 index 000000000..de6d6de02 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xml-root-1-ref.xml @@ -0,0 +1,2 @@ +<?xml-stylesheet href="block-xml-root-1-ref.css" ?> +<root><leaf/></root> diff --git a/layout/reftests/margin-collapsing/block-xml-root-1.css b/layout/reftests/margin-collapsing/block-xml-root-1.css new file mode 100644 index 000000000..8289e3205 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xml-root-1.css @@ -0,0 +1,10 @@ +root { + display: block; + margin: 20px 0; +} +leaf { + display: block; + background-color: green; + margin: 10px 0; + height: 100px; +} diff --git a/layout/reftests/margin-collapsing/block-xml-root-1.xml b/layout/reftests/margin-collapsing/block-xml-root-1.xml new file mode 100644 index 000000000..a0681c6ae --- /dev/null +++ b/layout/reftests/margin-collapsing/block-xml-root-1.xml @@ -0,0 +1,2 @@ +<?xml-stylesheet href="block-xml-root-1.css" ?> +<root><leaf/></root> diff --git a/layout/reftests/margin-collapsing/block-zero-height-1a-ref.html b/layout/reftests/margin-collapsing/block-zero-height-1a-ref.html new file mode 100644 index 000000000..3c16bc617 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-1a-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#b { + height: 10px; + background-color: red; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-1a.html b/layout/reftests/margin-collapsing/block-zero-height-1a.html new file mode 100644 index 000000000..871a556f5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-1a.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; +} +#b { + background-color: green; + margin-top: 10px; +} +#c { + margin-top: 20px; + margin-bottom: 30px; + height: 0; +} +#d { + height: 10px; + background-color: red; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"> + <div id="c"> + <div id="d"></div> + </div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-1b-ref.html b/layout/reftests/margin-collapsing/block-zero-height-1b-ref.html new file mode 100644 index 000000000..9a976b3ef --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-1b-ref.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#b { + background-color: red; + padding-top: 10px; +} +#c { + background-color: green; + padding-top: 20px; +} +#d { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"> + <div id="c"> + <div id="d"></div> + </div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-1b.html b/layout/reftests/margin-collapsing/block-zero-height-1b.html new file mode 100644 index 000000000..8db97a5b3 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-1b.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + height: 20px; + background-color: green; +} +#b { + background-color: green; + margin-top: 10px; +} +#c { + margin-top: 20px; + margin-bottom: 30px; + height: 0; +} +#d { + height: 10px; + background-color: red; +} +#e { + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"> + <div id="c"> + <div id="d"></div> + </div> + <div id="e"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-2a-ref.html b/layout/reftests/margin-collapsing/block-zero-height-2a-ref.html new file mode 100644 index 000000000..74f4601c8 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-2a-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; + height: 50px; +} +#b { + height: 10px; width: 100px; + background-color: red; + margin-bottom: 30px; +} +#c { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +<div id="c"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-2a.html b/layout/reftests/margin-collapsing/block-zero-height-2a.html new file mode 100644 index 000000000..1f4cc6f3a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-2a.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a { + background-color: green; +} +#b { + height: 20px; +} +#c { + margin-top: 30px; + margin-bottom: 40px; + height: 0; +} +#d { + height: 10px; width: 100px; + background-color: red; +} +#e { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="a"> + <div id="b"></div> + <div id="c"> + <div id="d"></div> + </div> +</div> +<div id="e"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-2b-ref.html b/layout/reftests/margin-collapsing/block-zero-height-2b-ref.html new file mode 100644 index 000000000..6d1914451 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-2b-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#a, #c { + height: 20px; + background-color: green; + margin-bottom: 30px; +} +#b { + height: 10px; width: 100px; + background-color: red; + margin-top: 30px; + margin-bottom: 30px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +<div id="c"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-2b.html b/layout/reftests/margin-collapsing/block-zero-height-2b.html new file mode 100644 index 000000000..b2e064782 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-2b.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#b { + height: 20px; + background-color: green; +} +#c { + margin-top: 30px; + margin-bottom: 40px; + height: 0; +} +#d { + height: 10px; width: 100px; + background-color: red; +} +#e { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="b"></div> +<div id="a"> + <div id="c"> + <div id="d"></div> + </div> +</div> +<div id="e"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-2c-ref.html b/layout/reftests/margin-collapsing/block-zero-height-2c-ref.html new file mode 100644 index 000000000..78ed9af99 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-2c-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin-top: 0; +} +#a { + margin-top: 30px; + height: 10px; width: 100px; + background-color: red; +} +#b { + height: 20px; + background-color: green; + margin-top: 30px; +} +</style> +</head> +<body> +<div id="a"></div> +<div id="b"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-2c.html b/layout/reftests/margin-collapsing/block-zero-height-2c.html new file mode 100644 index 000000000..14153a324 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-2c.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +html, body { + margin-top: 0; +} +#a { + background-color: green; +} +#c { + margin-top: 30px; + margin-bottom: 40px; + height: 0; +} +#d { + height: 10px; width: 100px; + background-color: red; +} +#e { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="a"> + <div id="b"></div> + <div id="c"> + <div id="d"></div> + </div> +</div> +<div id="e"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-3-ref.html b/layout/reftests/margin-collapsing/block-zero-height-3-ref.html new file mode 100644 index 000000000..30c3b2e4a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-3-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#abs { + position: absolute; + left: 20px; top: 20px; + width: 100px; height: 100px; + background-color: green; +} +</style> +</head> +<body> +<div id="abs"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-3a.html b/layout/reftests/margin-collapsing/block-zero-height-3a.html new file mode 100644 index 000000000..52b1c231e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-3a.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#abs { + position: absolute; + left: 20px; top: 20px; + width: 100px; + background-color: red; +} +#parent { + margin-bottom: 70px; +} +#zero-height { + margin-bottom: 100px; + height: 0; +} +#child-of-zero-height { + height: 100px; background: green; +} +</style> +</head> +<body> +<div id="abs"> + <div id="parent"> + <div id="zero-height"> + <div id="child-of-zero-height"></div> + </div> + </div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-3b.html b/layout/reftests/margin-collapsing/block-zero-height-3b.html new file mode 100644 index 000000000..72b4c64a9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-3b.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#abs { + position: absolute; + left: 20px; top: 20px; + width: 100px; + background-color: red; +} +#parent { + margin-bottom: 100px; +} +#zero-height { + margin-bottom: 70px; + height: 0; +} +#child-of-zero-height { + height: 100px; background: green; +} +</style> +</head> +<body> +<div id="abs"> + <div id="parent"> + <div id="zero-height"> + <div id="child-of-zero-height"></div> + </div> + </div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-height-3c.html b/layout/reftests/margin-collapsing/block-zero-height-3c.html new file mode 100644 index 000000000..8b9205c58 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-height-3c.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#abs { + position: absolute; + left: 20px; top: 20px; + width: 100px; + background-color: red; +} +#parent { + margin-bottom: 100px; +} +#zero-height { + margin-bottom: 100px; + height: 0; +} +#child-of-zero-height { + height: 100px; background: green; +} +</style> +</head> +<body> +<div id="abs"> + <div id="parent"> + <div id="zero-height"> + <div id="child-of-zero-height"></div> + </div> + </div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-1-noref.html b/layout/reftests/margin-collapsing/block-zero-min-height-1-noref.html new file mode 100644 index 000000000..feabf5f2d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-1-noref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + height: 30px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-1-ref.html b/layout/reftests/margin-collapsing/block-zero-min-height-1-ref.html new file mode 100644 index 000000000..e7cee1f90 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-1-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + height: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-1a.html b/layout/reftests/margin-collapsing/block-zero-min-height-1a.html new file mode 100644 index 000000000..a1f230040 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-1a.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: auto; + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-1b.html b/layout/reftests/margin-collapsing/block-zero-min-height-1b.html new file mode 100644 index 000000000..3f365be01 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-1b.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: auto; + margin-top: 20px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-1c.html b/layout/reftests/margin-collapsing/block-zero-min-height-1c.html new file mode 100644 index 000000000..9b1d1a549 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-1c.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: auto; + margin-top: 20px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-1d.html b/layout/reftests/margin-collapsing/block-zero-min-height-1d.html new file mode 100644 index 000000000..aaf8c231e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-1d.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: 0; + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-1e.html b/layout/reftests/margin-collapsing/block-zero-min-height-1e.html new file mode 100644 index 000000000..81e8ab7c5 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-1e.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: 0; + margin-top: 20px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-1f.html b/layout/reftests/margin-collapsing/block-zero-min-height-1f.html new file mode 100644 index 000000000..5f1ac0c84 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-1f.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: 0; + margin-top: 20px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2-noref.html b/layout/reftests/margin-collapsing/block-zero-min-height-2-noref.html new file mode 100644 index 000000000..e7cee1f90 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2-noref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + height: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2a.html b/layout/reftests/margin-collapsing/block-zero-min-height-2a.html new file mode 100644 index 000000000..cf3bb13b9 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2a.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + font-size: 15px; + line-height: 1; + min-height: 0; + height: auto; + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> </div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2ab-ref.html b/layout/reftests/margin-collapsing/block-zero-min-height-2ab-ref.html new file mode 100644 index 000000000..c70743372 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2ab-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + height: 45px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2b.html b/layout/reftests/margin-collapsing/block-zero-min-height-2b.html new file mode 100644 index 000000000..51fb629ed --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2b.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + font-size: 15px; + line-height: 1; + min-height: 0; + height: auto; + margin-top: 20px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> </div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2c-ref.html b/layout/reftests/margin-collapsing/block-zero-min-height-2c-ref.html new file mode 100644 index 000000000..af25626d4 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2c-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + height: 55px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2c.html b/layout/reftests/margin-collapsing/block-zero-min-height-2c.html new file mode 100644 index 000000000..955796927 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2c.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + font-size: 15px; + line-height: 1; + min-height: 0; + height: auto; + margin-top: 20px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> </div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2d.html b/layout/reftests/margin-collapsing/block-zero-min-height-2d.html new file mode 100644 index 000000000..7dc0832d0 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2d.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: 0; + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> </div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2de-ref.html b/layout/reftests/margin-collapsing/block-zero-min-height-2de-ref.html new file mode 100644 index 000000000..feabf5f2d --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2de-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + height: 30px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2e.html b/layout/reftests/margin-collapsing/block-zero-min-height-2e.html new file mode 100644 index 000000000..1877a3446 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2e.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: 0; + margin-top: 20px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> </div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2f-ref.html b/layout/reftests/margin-collapsing/block-zero-min-height-2f-ref.html new file mode 100644 index 000000000..dcc932318 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2f-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + height: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-2f.html b/layout/reftests/margin-collapsing/block-zero-min-height-2f.html new file mode 100644 index 000000000..20e8af97e --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-2f.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: 0; + margin-top: 20px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> </div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-3-ref.html b/layout/reftests/margin-collapsing/block-zero-min-height-3-ref.html new file mode 100644 index 000000000..dcc932318 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-3-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + height: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"></div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-3a.html b/layout/reftests/margin-collapsing/block-zero-min-height-3a.html new file mode 100644 index 000000000..0f11a0efb --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-3a.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: auto; + margin-top: 10px; + margin-bottom: 20px; +} +#margin-only-child { + margin-top: 30px; + margin-bottom: 40px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> + <div id="margin-only-child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-3b.html b/layout/reftests/margin-collapsing/block-zero-min-height-3b.html new file mode 100644 index 000000000..3a5406cf7 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-3b.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: auto; + margin-top: 40px; + margin-bottom: 10px; +} +#margin-only-child { + margin-top: 20px; + margin-bottom: 30px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> + <div id="margin-only-child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-3c.html b/layout/reftests/margin-collapsing/block-zero-min-height-3c.html new file mode 100644 index 000000000..969b4dd2a --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-3c.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: auto; + margin-top: 30px; + margin-bottom: 40px; +} +#margin-only-child { + margin-top: 10px; + margin-bottom: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> + <div id="margin-only-child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/block-zero-min-height-3d.html b/layout/reftests/margin-collapsing/block-zero-min-height-3d.html new file mode 100644 index 000000000..6fb57e024 --- /dev/null +++ b/layout/reftests/margin-collapsing/block-zero-min-height-3d.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#min-height { + min-height: 0; + height: auto; + margin-top: 20px; + margin-bottom: 30px; +} +#margin-only-child { + margin-top: 40px; + margin-bottom: 10px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="min-height"> + <div id="margin-only-child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-child-1-dyn.html b/layout/reftests/margin-collapsing/caption-child-1-dyn.html new file mode 100644 index 000000000..1dfe60090 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-child-1-dyn.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#table { + display: table; + width: 100px; +} +#caption { + display: table-cell; + background-color: yellow; +} +#block { + height: 20px; + margin: 20px 0; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="table"> + <div id="caption"> + <div id="block"></div> + </div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-child-1-ref.html b/layout/reftests/margin-collapsing/caption-child-1-ref.html new file mode 100644 index 000000000..5ebbe8465 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-child-1-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator, #block { + height: 20px; + background-color: blue; +} +#table { + width: 100px; +} +#caption { + padding: 20px 0; + background-color: yellow; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="table"> + <div id="caption"> + <div id="block"></div> + </div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-child-1.html b/layout/reftests/margin-collapsing/caption-child-1.html new file mode 100644 index 000000000..e54ad40e4 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-child-1.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: blue; +} +#table { + display: table; + width: 100px; +} +#caption { + display: table-caption; + background-color: yellow; +} +#block { + height: 20px; + margin: 20px 0; + background-color: blue; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="table"> + <div id="caption"> + <div id="block"></div> + </div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-1-noref.html b/layout/reftests/margin-collapsing/caption-sibling-1-noref.html new file mode 100644 index 000000000..796478cfa --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-1-noref.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + width: 100px; +} +#caption1 { + height: 20px; + background-color: red; + margin-bottom: 30px; +} +#caption2 { + height: 20px; + background-color: blue; + margin-bottom: 30px; +} +#caption3 { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-1-noref2.html b/layout/reftests/margin-collapsing/caption-sibling-1-noref2.html new file mode 100644 index 000000000..185eb860a --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-1-noref2.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + width: 100px; +} +#caption1 { + height: 20px; + background-color: red; + margin-bottom: 40px; +} +#caption2 { + height: 20px; + background-color: blue; + margin-bottom: 40px; +} +#caption3 { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-1-ref.html b/layout/reftests/margin-collapsing/caption-sibling-1-ref.html new file mode 100644 index 000000000..c6b2f2d83 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-1-ref.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + width: 100px; +} +#caption1 { + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#caption2 { + height: 20px; + background-color: blue; + margin-bottom: 20px; +} +#caption3 { + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-1a-dyn.html b/layout/reftests/margin-collapsing/caption-sibling-1a-dyn.html new file mode 100644 index 000000000..305927fd9 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-1a-dyn.html @@ -0,0 +1,45 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + display: table; + width: 100px; +} +#caption1 { + display: table-caption; + height: 20px; + background-color: red; + margin-bottom: 10px; +} +#caption2 { + display: none; + height: 20px; + background-color: blue; + margin: 20px 0; +} +#caption3 { + display: table-caption; + height: 20px; + background-color: green; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption2').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-1a.html b/layout/reftests/margin-collapsing/caption-sibling-1a.html new file mode 100644 index 000000000..07ce4b258 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-1a.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + display: table; + width: 100px; +} +#caption1 { + display: table-caption; + height: 20px; + background-color: red; + margin-bottom: 10px; +} +#caption2 { + display: table-caption; + height: 20px; + background-color: blue; + margin: 20px 0; +} +#caption3 { + display: table-caption; + height: 20px; + background-color: green; + margin-top: 10px; +} +</style> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-1b-dyn.html b/layout/reftests/margin-collapsing/caption-sibling-1b-dyn.html new file mode 100644 index 000000000..b9b34f6ab --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-1b-dyn.html @@ -0,0 +1,45 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + display: table; + width: 100px; +} +#caption1 { + display: table-caption; + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#caption2 { + display: none; + height: 20px; + background-color: blue; + margin: 20px 0; +} +#caption3 { + display: table-caption; + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption2').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-1b.html b/layout/reftests/margin-collapsing/caption-sibling-1b.html new file mode 100644 index 000000000..5bb76cfd7 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-1b.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + display: table; + width: 100px; +} +#caption1 { + display: table-caption; + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#caption2 { + display: table-caption; + height: 20px; + background-color: blue; + margin: 20px 0; +} +#caption3 { + display: table-caption; + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-1c-dyn.html b/layout/reftests/margin-collapsing/caption-sibling-1c-dyn.html new file mode 100644 index 000000000..9a24c2c68 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-1c-dyn.html @@ -0,0 +1,45 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + display: table; + width: 100px; +} +#caption1 { + display: table-caption; + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#caption2 { + display: none; + height: 20px; + background-color: blue; + margin: 10px 0; +} +#caption3 { + display: table-caption; + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption2').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-1c.html b/layout/reftests/margin-collapsing/caption-sibling-1c.html new file mode 100644 index 000000000..836c46e32 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-1c.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + display: table; + width: 100px; +} +#caption1 { + display: table-caption; + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#caption2 { + display: table-caption; + height: 20px; + background-color: blue; + margin: 10px 0; +} +#caption3 { + display: table-caption; + height: 20px; + background-color: green; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-2-dyn.html b/layout/reftests/margin-collapsing/caption-sibling-2-dyn.html new file mode 100644 index 000000000..cf66b14f6 --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-2-dyn.html @@ -0,0 +1,46 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + display: table; + width: 100px; +} +#caption1 { + display: table-caption; + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#caption2 { + display: table-caption; + height: 20px; + background-color: blue; + margin-top: 10px; + margin-bottom: 20px; +} +#caption3 { + display: table-caption; + height: 20px; + background-color: green; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption2').style.display = 'none'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-2-noref.html b/layout/reftests/margin-collapsing/caption-sibling-2-noref.html new file mode 100644 index 000000000..cfd34effb --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-2-noref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + display: table; + width: 100px; +} +#caption1 { + display: block; + height: 20px; + background-color: red; + margin-bottom: 30px; +} +#caption3 { + display: block; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/caption-sibling-2-ref.html b/layout/reftests/margin-collapsing/caption-sibling-2-ref.html new file mode 100644 index 000000000..a9c3f7e8f --- /dev/null +++ b/layout/reftests/margin-collapsing/caption-sibling-2-ref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<!-- dbaron thinks the validity of this test is questionable, see + https://bugzilla.mozilla.org/show_bug.cgi?id=477462#c20 and #c21 --> +<style type="text/css"> +#table { + display: table; + width: 100px; +} +#caption1 { + display: block; + height: 20px; + background-color: red; + margin-bottom: 20px; +} +#caption3 { + display: block; + height: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="table"> + <div id="caption1"></div> + <div id="caption2"></div> + <div id="caption3"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-child-1-dyn.html b/layout/reftests/margin-collapsing/column-child-1-dyn.html new file mode 100644 index 000000000..58781e915 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-child-1-dyn.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator, #child { + height: 20px; + background-color: blue; +} +#multi-column { + background-color: yellow; +} +#child { + margin: 20px 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('multi-column').style.MozColumnCount = 1; + document.getElementById('multi-column').style.columnCount = 1; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="multi-column"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-child-1-ref.html b/layout/reftests/margin-collapsing/column-child-1-ref.html new file mode 100644 index 000000000..7715129b6 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-child-1-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator, #child { + height: 20px; + background-color: blue; +} +#multi-column { + background-color: yellow; +} +.margin { + height: 20px; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="multi-column"> + <div class="margin"></div> + <div id="child"></div> + <div class="margin"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-child-1.html b/layout/reftests/margin-collapsing/column-child-1.html new file mode 100644 index 000000000..bc557f805 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-child-1.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator, #child { + height: 20px; + background-color: blue; +} +#multi-column { + -moz-column-count: 1; + column-count: 1; + background-color: yellow; +} +#child { + margin: 20px 0; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="multi-column"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-1-ref.html b/layout/reftests/margin-collapsing/column-sibling-1-ref.html new file mode 100644 index 000000000..1c7c66311 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-1-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: orange; +} +#multi-column { + height: 20px; + background-color: blue; +} +.spacer { + height: 20px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div class="spacer"></div> +<div id="multi-column"></div> +<div class="spacer"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-1a-dyn.html b/layout/reftests/margin-collapsing/column-sibling-1a-dyn.html new file mode 100644 index 000000000..c7a05c68f --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-1a-dyn.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: orange; +} +#block1 { + margin-bottom: 10px; +} +#multi-column { + display: none; + -moz-column-count: 1; + column-count: 1; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#block2 { + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('multi-column').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="multi-column"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-1a.html b/layout/reftests/margin-collapsing/column-sibling-1a.html new file mode 100644 index 000000000..2f2a1e84e --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-1a.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: orange; +} +#block1 { + margin-bottom: 10px; +} +#multi-column { + -moz-column-count: 1; + column-count: 1; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#block2 { + margin-top: 10px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="multi-column"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-1b-dyn.html b/layout/reftests/margin-collapsing/column-sibling-1b-dyn.html new file mode 100644 index 000000000..26949a434 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-1b-dyn.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: orange; +} +#block1 { + margin-bottom: 20px; +} +#multi-column { + display: none; + -moz-column-count: 1; + column-count: 1; + height: 20px; + margin: 10px 0; + background-color: blue; +} +#block2 { + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('multi-column').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="multi-column"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-1b.html b/layout/reftests/margin-collapsing/column-sibling-1b.html new file mode 100644 index 000000000..1bf4dfed6 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-1b.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: orange; +} +#block1 { + margin-bottom: 20px; +} +#multi-column { + -moz-column-count: 1; + column-count: 1; + height: 20px; + margin: 10px 0; + background-color: blue; +} +#block2 { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="multi-column"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-1c-dyn.html b/layout/reftests/margin-collapsing/column-sibling-1c-dyn.html new file mode 100644 index 000000000..9a0c9dc89 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-1c-dyn.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: orange; +} +#block1 { + margin-bottom: 20px; +} +#multi-column { + display: none; + -moz-column-count: 1; + column-count: 1; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#block2 { + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('multi-column').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="multi-column"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-1c.html b/layout/reftests/margin-collapsing/column-sibling-1c.html new file mode 100644 index 000000000..90446d65c --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-1c.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: orange; +} +#block1 { + margin-bottom: 20px; +} +#multi-column { + -moz-column-count: 1; + column-count: 1; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#block2 { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="multi-column"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-2-ref.html b/layout/reftests/margin-collapsing/column-sibling-2-ref.html new file mode 100644 index 000000000..3d160baaa --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-2-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.multi-column { + height: 20px; + background-color: blue; +} +.spacer { + height: 20px; +} +</style> +</head> +<body> +<div class="multi-column"></div> +<div class="spacer"></div> +<div class="multi-column"></div> +<div class="spacer"></div> +<div class="multi-column"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-2a-dyn.html b/layout/reftests/margin-collapsing/column-sibling-2a-dyn.html new file mode 100644 index 000000000..643f7b98f --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-2a-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#multi-column1, #multi-column2, #multi-column3 { + -moz-column-count: 1; + column-count: 1; + height: 20px; + background-color: blue; +} +#multi-column1 { + margin-bottom: 10px; +} +#multi-column2 { + display: none; + margin: 20px 0; +} +#multi-column3 { + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('multi-column2').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="multi-column1"></div> +<div id="multi-column2"></div> +<div id="multi-column3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-2a.html b/layout/reftests/margin-collapsing/column-sibling-2a.html new file mode 100644 index 000000000..e47535290 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-2a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#multi-column1, #multi-column2, #multi-column3 { + -moz-column-count: 1; + column-count: 1; + height: 20px; + background-color: blue; +} +#multi-column1 { + margin-bottom: 10px; +} +#multi-column2 { + margin: 20px 0; +} +#multi-column3 { + margin-top: 10px; +} +</style> +</head> +<body> +<div id="multi-column1"></div> +<div id="multi-column2"></div> +<div id="multi-column3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-2b-dyn.html b/layout/reftests/margin-collapsing/column-sibling-2b-dyn.html new file mode 100644 index 000000000..85df871b4 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-2b-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#multi-column1, #multi-column2, #multi-column3 { + -moz-column-count: 1; + column-count: 1; + height: 20px; + background-color: blue; +} +#multi-column1 { + margin-bottom: 20px; +} +#multi-column2 { + display: none; + margin: 10px 0; +} +#multi-column3 { + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('multi-column2').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="multi-column1"></div> +<div id="multi-column2"></div> +<div id="multi-column3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-2b.html b/layout/reftests/margin-collapsing/column-sibling-2b.html new file mode 100644 index 000000000..484674559 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-2b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#multi-column1, #multi-column2, #multi-column3 { + -moz-column-count: 1; + column-count: 1; + height: 20px; + background-color: blue; +} +#multi-column1 { + margin-bottom: 20px; +} +#multi-column2 { + margin: 10px 0; +} +#multi-column3 { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="multi-column1"></div> +<div id="multi-column2"></div> +<div id="multi-column3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-2c-dyn.html b/layout/reftests/margin-collapsing/column-sibling-2c-dyn.html new file mode 100644 index 000000000..d9e89ec5e --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-2c-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#multi-column1, #multi-column2, #multi-column3 { + -moz-column-count: 1; + column-count: 1; + height: 20px; + background-color: blue; +} +#multi-column1 { + margin-bottom: 20px; +} +#multi-column2 { + display: none; + margin: 20px 0; +} +#multi-column3 { + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('multi-column2').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="multi-column1"></div> +<div id="multi-column2"></div> +<div id="multi-column3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/column-sibling-2c.html b/layout/reftests/margin-collapsing/column-sibling-2c.html new file mode 100644 index 000000000..9adff9816 --- /dev/null +++ b/layout/reftests/margin-collapsing/column-sibling-2c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#multi-column1, #multi-column2, #multi-column3 { + -moz-column-count: 1; + column-count: 1; + height: 20px; + background-color: blue; +} +#multi-column1 { + margin-bottom: 20px; +} +#multi-column2 { + margin: 20px 0; +} +#multi-column3 { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="multi-column1"></div> +<div id="multi-column2"></div> +<div id="multi-column3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/dynamic-add-text-1-ref.html b/layout/reftests/margin-collapsing/dynamic-add-text-1-ref.html new file mode 100644 index 000000000..9e201e001 --- /dev/null +++ b/layout/reftests/margin-collapsing/dynamic-add-text-1-ref.html @@ -0,0 +1,6 @@ +<html> + <head></head> + <body> + <div id="a" style="margin-bottom: 1em;">A</div>x<div style="margin-top: 2em;">B</div> + </body> +</html> diff --git a/layout/reftests/margin-collapsing/dynamic-add-text-1.html b/layout/reftests/margin-collapsing/dynamic-add-text-1.html new file mode 100644 index 000000000..cc8b2bf35 --- /dev/null +++ b/layout/reftests/margin-collapsing/dynamic-add-text-1.html @@ -0,0 +1,6 @@ +<html> + <head></head> + <body onload="document.getElementById('a').nextSibling.data = 'x';"> + <div id="a" style="margin-bottom: 1em;">A</div> <div style="margin-top: 2em;">B</div> + </body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-child-1-dyn.html b/layout/reftests/margin-collapsing/fieldset-child-1-dyn.html new file mode 100644 index 000000000..295432e5c --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-child-1-dyn.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +fieldset { + margin: 0; + padding: 0; + border: none; + background-color: lightgreen; +} +#child { + height: 40px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('child').style.margin = '20px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<fieldset> + <div id="child"></div> +</fieldset> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-child-1-ref.html b/layout/reftests/margin-collapsing/fieldset-child-1-ref.html new file mode 100644 index 000000000..585dc56d9 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-child-1-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#fieldset { + padding: 20px 0; + background-color: lightgreen; +} +#child { + height: 40px; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="fieldset"> + <div id="child"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-child-1.html b/layout/reftests/margin-collapsing/fieldset-child-1.html new file mode 100644 index 000000000..a9e7a7820 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-child-1.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +fieldset { + margin: 0; + padding: 0; + border: none; + background-color: lightgreen; +} +#child { + height: 40px; + margin: 20px 0; + background-color: green; +} +</style> +</head> +<body> +<div class="separator"></div> +<fieldset> + <div id="child"></div> +</fieldset> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-1-ref.html b/layout/reftests/margin-collapsing/fieldset-sibling-1-ref.html new file mode 100644 index 000000000..dd04af13a --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-1-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator, #fieldset { + height: 20px; + background-color: green; +} +#spacer { + padding: 20px 0; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="spacer"> + <div id="fieldset"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-1a-dyn.html b/layout/reftests/margin-collapsing/fieldset-sibling-1a-dyn.html new file mode 100644 index 000000000..c99607db6 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-1a-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +fieldset { + height: 20px; + margin: 0; + padding: 0; + border: none; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('fieldset')[0].style.margin = '20px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator-top"></div> +<fieldset></fieldset> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-1a.html b/layout/reftests/margin-collapsing/fieldset-sibling-1a.html new file mode 100644 index 000000000..5c01bed86 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-1a.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 10px; + background-color: green; +} +fieldset { + height: 20px; + margin: 20px 0; + padding: 0; + border: none; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 10px; + background-color: green; +} +</style> +</head> +<body> +<div id="separator-top"></div> +<fieldset></fieldset> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-1b-dyn.html b/layout/reftests/margin-collapsing/fieldset-sibling-1b-dyn.html new file mode 100644 index 000000000..a7d1e40a3 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-1b-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +fieldset { + height: 20px; + margin: 0; + padding: 0; + border: none; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('fieldset')[0].style.margin = '10px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator-top"></div> +<fieldset></fieldset> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-1b.html b/layout/reftests/margin-collapsing/fieldset-sibling-1b.html new file mode 100644 index 000000000..2099d3588 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-1b.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +fieldset { + height: 20px; + margin: 10px 0; + padding: 0; + border: none; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="separator-top"></div> +<fieldset></fieldset> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-1c-dyn.html b/layout/reftests/margin-collapsing/fieldset-sibling-1c-dyn.html new file mode 100644 index 000000000..91e97ced1 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-1c-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +fieldset { + height: 20px; + margin: 0; + padding: 0; + border: none; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementsByTagName('fieldset')[0].style.margin = '20px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="separator-top"></div> +<fieldset></fieldset> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-1c.html b/layout/reftests/margin-collapsing/fieldset-sibling-1c.html new file mode 100644 index 000000000..e525761d4 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-1c.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#separator-top { + height: 20px; + margin-bottom: 20px; + background-color: green; +} +fieldset { + height: 20px; + margin: 20px 0; + padding: 0; + border: none; + background-color: green; +} +#separator-bottom { + height: 20px; + margin-top: 20px; + background-color: green; +} +</style> +</head> +<body> +<div id="separator-top"></div> +<fieldset></fieldset> +<div id="separator-bottom"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-2-ref1.html b/layout/reftests/margin-collapsing/fieldset-sibling-2-ref1.html new file mode 100644 index 000000000..f9ad41b9e --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-2-ref1.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +fieldset { + height: 20px; + margin: 0 0 20px; + padding: 0; + border: none; + background-color: green; +} +</style> +</head> +<body> +<fieldset></fieldset> +<fieldset></fieldset> +<fieldset></fieldset> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-2-ref2.html b/layout/reftests/margin-collapsing/fieldset-sibling-2-ref2.html new file mode 100644 index 000000000..48cda7961 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-2-ref2.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +div { + height: 20px; +} +.fieldset { + background-color: green; +} +</style> +</head> +<body> +<div class="fieldset"></div> +<div></div> +<div class="fieldset"></div> +<div></div> +<div class="fieldset"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-2a-dyn.html b/layout/reftests/margin-collapsing/fieldset-sibling-2a-dyn.html new file mode 100644 index 000000000..2e825dd33 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-2a-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +fieldset { + height: 20px; + padding: 0; + border: none; + background-color: green; +} +#top { + margin: 0 0 10px; +} +#middle { + margin: 0; +} +#bottom { + margin: 10px 0 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('middle').style.margin = '20px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<fieldset id="top"></fieldset> +<fieldset id="middle"></fieldset> +<fieldset id="bottom"></fieldset> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-2a.html b/layout/reftests/margin-collapsing/fieldset-sibling-2a.html new file mode 100644 index 000000000..1b4ff33e1 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-2a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +fieldset { + height: 20px; + padding: 0; + border: none; + background-color: green; +} +#top { + margin: 0 0 10px; +} +#middle { + margin: 20px 0; +} +#bottom { + margin: 10px 0 0; +} +</style> +</head> +<body> +<fieldset id="top"></fieldset> +<fieldset id="middle"></fieldset> +<fieldset id="bottom"></fieldset> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-2b-dyn.html b/layout/reftests/margin-collapsing/fieldset-sibling-2b-dyn.html new file mode 100644 index 000000000..8b8a2eac3 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-2b-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +fieldset { + height: 20px; + padding: 0; + border: none; + background-color: green; +} +#top { + margin: 0 0 20px; +} +#middle { + margin: 0; +} +#bottom { + margin: 20px 0 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('middle').style.margin = '10px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<fieldset id="top"></fieldset> +<fieldset id="middle"></fieldset> +<fieldset id="bottom"></fieldset> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-2b.html b/layout/reftests/margin-collapsing/fieldset-sibling-2b.html new file mode 100644 index 000000000..824127c34 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-2b.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +fieldset { + height: 20px; + padding: 0; + border: none; + background-color: green; +} +#top { + margin: 0 0 20px; +} +#middle { + margin: 10px 0; +} +#bottom { + margin: 20px 0 0; +} +</style> +</head> +<body> +<fieldset id="top"></fieldset> +<fieldset id="middle"></fieldset> +<fieldset id="bottom"></fieldset> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-2c-dyn.html b/layout/reftests/margin-collapsing/fieldset-sibling-2c-dyn.html new file mode 100644 index 000000000..76f3827c4 --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-2c-dyn.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +fieldset { + height: 20px; + padding: 0; + border: none; + background-color: green; +} +#top { + margin: 0 0 20px; +} +#middle { + margin: 0; +} +#bottom { + margin: 20px 0 0; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('middle').style.margin = '20px 0'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<fieldset id="top"></fieldset> +<fieldset id="middle"></fieldset> +<fieldset id="bottom"></fieldset> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/fieldset-sibling-2c.html b/layout/reftests/margin-collapsing/fieldset-sibling-2c.html new file mode 100644 index 000000000..de4e16cbf --- /dev/null +++ b/layout/reftests/margin-collapsing/fieldset-sibling-2c.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +fieldset { + height: 20px; + padding: 0; + border: none; + background-color: green; +} +#top { + margin: 0 0 20px; +} +#middle { + margin: 20px 0; +} +#bottom { + margin: 20px 0 0; +} +</style> +</head> +<body> +<fieldset id="top"></fieldset> +<fieldset id="middle"></fieldset> +<fieldset id="bottom"></fieldset> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-1-dyn.html b/layout/reftests/margin-collapsing/inline-block-child-1-dyn.html new file mode 100644 index 000000000..6376b99d8 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-1-dyn.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + display: inline-block; + background-color: green; +} +#child { + display: inline; + height: 40px; width: 200px; + margin: 20px 0; + vertical-align: bottom; + background-color: lightgreen; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('child').style.display = 'inline-block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-1-ref.html b/layout/reftests/margin-collapsing/inline-block-child-1-ref.html new file mode 100644 index 000000000..8a9ef9d6d --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-1-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + height: 40px; width: 200px; + padding: 20px 0; + background-color: green; +} +#child { + height: 40px; width: 200px; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-1.html b/layout/reftests/margin-collapsing/inline-block-child-1.html new file mode 100644 index 000000000..80e3c9c68 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-1.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + display: inline-block; + background-color: green; +} +#child { + display: inline-block; + height: 40px; width: 200px; + margin: 20px 0; + vertical-align: bottom; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="parent"> + <div id="child"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-2-dyn.html b/layout/reftests/margin-collapsing/inline-block-child-2-dyn.html new file mode 100644 index 000000000..3ffee5dc0 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-2-dyn.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#inline-block { + display: inline-block; + margin: 10px 0; + background-color: green; +} +#block { + margin: 10px 0; + background-color: lightgreen; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('block').style.display = 'block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="inline-block"><span id="block">Hello Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-2-noref.html b/layout/reftests/margin-collapsing/inline-block-child-2-noref.html new file mode 100644 index 000000000..b76c90f11 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-2-noref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#inline-block { + display: inline-block; + margin: 10px 0; + background-color: green; +} +#block { + margin: 10px 0; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="inline-block"><span id="block">Hello Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-2-ref.html b/layout/reftests/margin-collapsing/inline-block-child-2-ref.html new file mode 100644 index 000000000..7380c72d4 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-2-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#inline-block { + display: inline-block; + margin: 10px 0; + padding: 10px 0; + background-color: green; +} +#block { + display: inline-block; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="inline-block"><span id="block">Hello Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-2.html b/layout/reftests/margin-collapsing/inline-block-child-2.html new file mode 100644 index 000000000..f031640be --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-2.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#inline-block { + display: inline-block; + margin: 10px 0; + background-color: green; +} +#block { + display: block; + margin: 10px 0; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="inline-block"><span id="block">Hello Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-3-dyn.html b/layout/reftests/margin-collapsing/inline-block-child-3-dyn.html new file mode 100644 index 000000000..98f56d360 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-3-dyn.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +body { + margin: 0; +} +#block { + background-color: green; + margin: 10px 0; +} +#inline-block { + display: block; + margin: 10px 0; + background-color: lightgreen; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('inline-block').style.display = 'inline-block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block"><div id="inline-block">Hello Kitty</div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-3-ref.html b/layout/reftests/margin-collapsing/inline-block-child-3-ref.html new file mode 100644 index 000000000..6ca83dd06 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-3-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + margin: 0; + padding: 10px 0; +} +#block { + background-color: green; + padding: 10px 0; +} +#inline-block { + display: inline-block; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="block"><div id="inline-block">Hello Kitty</div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-child-3.html b/layout/reftests/margin-collapsing/inline-block-child-3.html new file mode 100644 index 000000000..e0bd8ae1d --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-child-3.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + margin: 0; +} +#block { + background-color: green; + margin: 10px 0; +} +#inline-block { + display: inline-block; + margin: 10px 0; + background-color: lightgreen; +} +</style> +</head> +<body> +<div id="block"><div id="inline-block">Hello Kitty</div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-horizontal-1-dyn.html b/layout/reftests/margin-collapsing/inline-block-horizontal-1-dyn.html new file mode 100644 index 000000000..8e422c6ba --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-horizontal-1-dyn.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#ib1 { + display: inline-block; + margin-right: 20px; +} +#ib2 { + display: none; + margin-left: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('ib2').style.display = 'inline-block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div><span id="ib1">Hello</span><span id="ib2">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-horizontal-1-noref.html b/layout/reftests/margin-collapsing/inline-block-horizontal-1-noref.html new file mode 100644 index 000000000..c7c9d93d0 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-horizontal-1-noref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +span { + display: inline-block; +} +#ib1 { + margin-right: 20px; +} +</style> +</head> +<body> +<div><span id="ib1">Hello</span><span>Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-horizontal-1-ref.html b/layout/reftests/margin-collapsing/inline-block-horizontal-1-ref.html new file mode 100644 index 000000000..1f7901bfa --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-horizontal-1-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +span { + display: inline-block; +} +#ib1 { + margin-right: 30px; +} +</style> +</head> +<body> +<div><span id="ib1">Hello</span><span>Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-horizontal-1.html b/layout/reftests/margin-collapsing/inline-block-horizontal-1.html new file mode 100644 index 000000000..243bc1296 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-horizontal-1.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#ib1 { + display: inline-block; + margin-right: 20px; +} +#ib2 { + display: inline-block; + margin-left: 10px; +} +</style> +</head> +<body> +<div><span id="ib1">Hello</span><span id="ib2">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-horizontal-2-dyn.html b/layout/reftests/margin-collapsing/inline-block-horizontal-2-dyn.html new file mode 100644 index 000000000..d11feb73e --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-horizontal-2-dyn.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#ib1 { + display: inline-block; + margin-right: 10px; +} +#ib2 { + display: none; + margin-left: 10px; + margin-right: 20px; +} +#ib3 { + display: inline-block; + margin-left: 40px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('ib2').style.display = 'inline-block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div><span id="ib1">Hello<span id="ib2">my</span></span><span id="ib3">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-horizontal-2-noref.html b/layout/reftests/margin-collapsing/inline-block-horizontal-2-noref.html new file mode 100644 index 000000000..369fd04ba --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-horizontal-2-noref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +span { + display: inline-block; +} +#ib2 { + margin-left: 10px; + margin-right: 40px; +} +</style> +</head> +<body> +<div><span id="ib1">Hello<span id="ib2">my</span></span><span id="ib3">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-horizontal-2-ref.html b/layout/reftests/margin-collapsing/inline-block-horizontal-2-ref.html new file mode 100644 index 000000000..c477651ec --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-horizontal-2-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +span { + display: inline-block; +} +#ib2 { + margin-left: 10px; + margin-right: 70px; +} +</style> +</head> +<body> +<div><span id="ib1">Hello<span id="ib2">my</span></span><span id="ib3">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-horizontal-2.html b/layout/reftests/margin-collapsing/inline-block-horizontal-2.html new file mode 100644 index 000000000..8c5be5f70 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-horizontal-2.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#ib1 { + display: inline-block; + margin-right: 10px; +} +#ib2 { + display: inline-block; + margin-left: 10px; + margin-right: 20px; +} +#ib3 { + display: inline-block; + margin-left: 40px; +} +</style> +</head> +<body> +<div><span id="ib1">Hello<span id="ib2">my</span></span><span id="ib3">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-1-ref.html b/layout/reftests/margin-collapsing/inline-block-sibling-1-ref.html new file mode 100644 index 000000000..1e1026bb8 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-1-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html> +<head> +<!-- specifying all heights in em units so that large font sizes + don't disrupt relationships; everything will scale together --> +<style type="text/css"> +#parent { + width: 200px; + background-color: lightgreen; +} +#inline-block1, #inline-block2 { + height: 2em; + background-color: green; +} +#margin { + height: 2em; +} +</style> +</head> +<body> +<div id="parent"> + <div id="inline-block1"></div> + <div id="margin"></div> + <div id="inline-block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-1a-dyn.html b/layout/reftests/margin-collapsing/inline-block-sibling-1a-dyn.html new file mode 100644 index 000000000..a3224b8e7 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-1a-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + width: 200px; + background-color: lightgreen; +} +#inline-block1, #inline-block2 { + height: 2em; width: 200px; + background-color: green; + vertical-align: bottom; +} +#inline-block1 { + margin-bottom: .5em; +} +#inline-block2 { + margin-top: 1.5em; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('inline-block1').style.display = 'inline-block'; + document.getElementById('inline-block2').style.display = 'inline-block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="inline-block1"></div> + <div id="inline-block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-1a.html b/layout/reftests/margin-collapsing/inline-block-sibling-1a.html new file mode 100644 index 000000000..f337963f4 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-1a.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + width: 200px; + background-color: lightgreen; +} +#inline-block1, #inline-block2 { + display: inline-block; + height: 2em; width: 200px; + background-color: green; + vertical-align: bottom; +} +#inline-block1 { + margin-bottom: .5em; +} +#inline-block2 { + margin-top: 1.5em; +} +</style> +</head> +<body> +<div id="parent"> + <div id="inline-block1"></div> + <div id="inline-block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-1b-dyn.html b/layout/reftests/margin-collapsing/inline-block-sibling-1b-dyn.html new file mode 100644 index 000000000..14d656756 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-1b-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + width: 200px; + background-color: lightgreen; +} +#inline-block1, #inline-block2 { + height: 2em; width: 200px; + background-color: green; + vertical-align: bottom; +} +#inline-block1 { + margin-bottom: 1.5em; +} +#inline-block2 { + margin-top: .5em; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('inline-block1').style.display = 'inline-block'; + document.getElementById('inline-block2').style.display = 'inline-block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="inline-block1"></div> + <div id="inline-block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-1b.html b/layout/reftests/margin-collapsing/inline-block-sibling-1b.html new file mode 100644 index 000000000..4a9df61da --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-1b.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + width: 200px; + background-color: lightgreen; +} +#inline-block1, #inline-block2 { + display: inline-block; + height: 2em; width: 200px; + background-color: green; + vertical-align: bottom; +} +#inline-block1 { + margin-bottom: 1.5em; +} +#inline-block2 { + margin-top: .5em; +} +</style> +</head> +<body> +<div id="parent"> + <div id="inline-block1"></div> + <div id="inline-block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-1c-dyn.html b/layout/reftests/margin-collapsing/inline-block-sibling-1c-dyn.html new file mode 100644 index 000000000..be14f2870 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-1c-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#parent { + width: 200px; + background-color: lightgreen; +} +#inline-block1, #inline-block2 { + height: 2em; width: 200px; + background-color: green; + vertical-align: bottom; +} +#inline-block1 { + margin-bottom: 1em; +} +#inline-block2 { + margin-top: 1em; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('inline-block1').style.display = 'inline-block'; + document.getElementById('inline-block2').style.display = 'inline-block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="parent"> + <div id="inline-block1"></div> + <div id="inline-block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-1c.html b/layout/reftests/margin-collapsing/inline-block-sibling-1c.html new file mode 100644 index 000000000..6b1c30db9 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-1c.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#parent { + width: 200px; + background-color: lightgreen; +} +#inline-block1, #inline-block2 { + display: inline-block; + height: 2em; width: 200px; + background-color: green; + vertical-align: bottom; +} +#inline-block1 { + margin-bottom: 1em; +} +#inline-block2 { + margin-top: 1em; +} +</style> +</head> +<body> +<div id="parent"> + <div id="inline-block1"></div> + <div id="inline-block2"></div> +</div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-2-dyn.html b/layout/reftests/margin-collapsing/inline-block-sibling-2-dyn.html new file mode 100644 index 000000000..be0847ac0 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-2-dyn.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +div { + height: 20px; width: 100%; + background-color: blue; + vertical-align: bottom; +} +#block1 { + margin-bottom: 15px; +} +#inline-block1 { + margin: 25px 0 25px; +} +#inline-block2 { + margin: 15px 0 15px; +} +#block2 { + margin-top: 25px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('inline-block1').style.display = 'inline-block'; + document.getElementById('inline-block2').style.display = 'inline-block'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="inline-block1"></div> +<div id="inline-block2"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-2-noref.html b/layout/reftests/margin-collapsing/inline-block-sibling-2-noref.html new file mode 100644 index 000000000..09b45c5b5 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-2-noref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +div { + height: 20px; width: 100%; + background-color: blue; + margin-bottom: 25px; +} +</style> +</head> +<body> +<div></div> +<div></div> +<div></div> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-2-ref.html b/layout/reftests/margin-collapsing/inline-block-sibling-2-ref.html new file mode 100644 index 000000000..fe69bdaf2 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-2-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +div { + height: 20px; width: 100%; + background-color: blue; + margin-bottom: 40px; +} +</style> +</head> +<body> +<div></div> +<div></div> +<div></div> +<div></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-block-sibling-2.html b/layout/reftests/margin-collapsing/inline-block-sibling-2.html new file mode 100644 index 000000000..7a569b86d --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-block-sibling-2.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +div { + height: 20px; width: 100%; + background-color: blue; + vertical-align: bottom; +} +#block1 { + margin-bottom: 15px; +} +#inline-block1 { + display: inline-block; + margin: 25px 0 25px; +} +#inline-block2 { + display: inline-block; + margin: 15px 0 15px; +} +#block2 { + margin-top: 25px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="inline-block1"></div> +<div id="inline-block2"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-horizontal-1-dyn.html b/layout/reftests/margin-collapsing/inline-horizontal-1-dyn.html new file mode 100644 index 000000000..c4f36c06d --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-horizontal-1-dyn.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#inline1 { + margin-right: 10px; +} +#inline2 { + display: none; + margin-left: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('inline2').style.display = 'inline'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div><span id="inline1">Hello</span><span id="inline2">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-horizontal-1-noref.html b/layout/reftests/margin-collapsing/inline-horizontal-1-noref.html new file mode 100644 index 000000000..2cef9cb2a --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-horizontal-1-noref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#inline1 { + margin-right: 20px; +} +</style> +</head> +<body> +<div><span id="inline1">Hello</span><span>Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-horizontal-1-ref.html b/layout/reftests/margin-collapsing/inline-horizontal-1-ref.html new file mode 100644 index 000000000..1011242a0 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-horizontal-1-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#inline1 { + margin-right: 30px; +} +</style> +</head> +<body> +<div><span id="inline1">Hello</span><span>Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-horizontal-1.html b/layout/reftests/margin-collapsing/inline-horizontal-1.html new file mode 100644 index 000000000..2b5be7c10 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-horizontal-1.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#inline1 { + margin-right: 10px; +} +#inline2 { + margin-left: 20px; +} +</style> +</head> +<body> +<div><span id="inline1">Hello</span><span id="inline2">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-horizontal-2-dyn.html b/layout/reftests/margin-collapsing/inline-horizontal-2-dyn.html new file mode 100644 index 000000000..01deb61a1 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-horizontal-2-dyn.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#inline1 { + margin-right: 10px; +} +#inline2 { + display: none; + margin-left: 10px; + margin-right: 20px; +} +#inline3 { + margin-left: 40px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('inline2').style.display = 'inline'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div><span id="inline1">Hello<span id="inline2">my</span></span><span id="inline3">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-horizontal-2-noref.html b/layout/reftests/margin-collapsing/inline-horizontal-2-noref.html new file mode 100644 index 000000000..a039f1584 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-horizontal-2-noref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#inline2 { + margin-left: 10px; + margin-right: 40px; +} +</style> +</head> +<body> +<div><span id="inline1">Hello<span id="inline2">my</span></span><span id="inline3">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-horizontal-2-ref.html b/layout/reftests/margin-collapsing/inline-horizontal-2-ref.html new file mode 100644 index 000000000..3939978bd --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-horizontal-2-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#inline2 { + margin-left: 10px; + margin-right: 70px; +} +</style> +</head> +<body> +<div><span id="inline1">Hello<span id="inline2">my</span></span><span id="inline3">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-horizontal-2.html b/layout/reftests/margin-collapsing/inline-horizontal-2.html new file mode 100644 index 000000000..f723c7d44 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-horizontal-2.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#inline1 { + margin-right: 10px; +} +#inline2 { + margin-left: 10px; + margin-right: 20px; +} +#inline3 { + margin-left: 40px; +} +</style> +</head> +<body> +<div><span id="inline1">Hello<span id="inline2">my</span></span><span id="inline3">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-table-horizontal-1-dyn.html b/layout/reftests/margin-collapsing/inline-table-horizontal-1-dyn.html new file mode 100644 index 000000000..06ef90be9 --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-table-horizontal-1-dyn.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#it1 { + display: inline-table; + margin-right: 20px; +} +#it2 { + display: none; + margin-left: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('it2').style.display = 'inline-table'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div><span id="it1">Hello</span><span id="it2">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-table-horizontal-1-noref.html b/layout/reftests/margin-collapsing/inline-table-horizontal-1-noref.html new file mode 100644 index 000000000..abccb7feb --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-table-horizontal-1-noref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#it1 { + display: inline-table; + margin-right: 20px; +} +#it2 { + display: inline-table; +} +</style> +</head> +<body> +<div><span id="it1">Hello</span><span id="it2">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-table-horizontal-1-ref.html b/layout/reftests/margin-collapsing/inline-table-horizontal-1-ref.html new file mode 100644 index 000000000..aad63ec3a --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-table-horizontal-1-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#it1 { + display: inline-table; + margin-right: 30px; +} +#it2 { + display: inline-table; +} +</style> +</head> +<body> +<div><span id="it1">Hello</span><span id="it2">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/inline-table-horizontal-1.html b/layout/reftests/margin-collapsing/inline-table-horizontal-1.html new file mode 100644 index 000000000..0496c962a --- /dev/null +++ b/layout/reftests/margin-collapsing/inline-table-horizontal-1.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +body { + font-family: sans-serif; +} +#it1 { + display: inline-table; + margin-right: 20px; +} +#it2 { + display: inline-table; + margin-left: 10px; +} +</style> +</head> +<body> +<div><span id="it1">Hello</span><span id="it2">Kitty</span></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/reftest-stylo.list b/layout/reftests/margin-collapsing/reftest-stylo.list new file mode 100644 index 000000000..652f1c578 --- /dev/null +++ b/layout/reftests/margin-collapsing/reftest-stylo.list @@ -0,0 +1,943 @@ +# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing +# Test Suite for CSS 2.1, 8.3.1 Collapsing margins - See Bug 477462 +# Based on CSS 2.1: http://www.w3.org/TR/2011/REC-CSS2-20110607/ +# and its Errata, Last revised: $Date: 2013-09-09 17:40:16 $ +# The structure of this manifest is intended to resemble the structure of +# the prose that defines collapsing margins. As a result, there are several +# sections where inline-block-, block-, and other- series are combined. +# E.g. the first section is about horizontal margins and includes both +# inline- and block series. +# "Horizontal margins never collapse." +# Horizontal margins of inline boxes do not collapse. +# The norefs for these tests depict margins that incorrectly collapsed. +== inline-horizontal-1.html inline-horizontal-1.html +== inline-horizontal-1.html inline-horizontal-1.html +== inline-horizontal-2.html inline-horizontal-2.html +== inline-horizontal-2.html inline-horizontal-2.html +skip-if(B2G||Mulet) == inline-horizontal-1-dyn.html inline-horizontal-1-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== inline-horizontal-1-dyn.html inline-horizontal-1-dyn.html +skip-if(B2G||Mulet) == inline-horizontal-2-dyn.html inline-horizontal-2-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== inline-horizontal-2-dyn.html inline-horizontal-2-dyn.html +# Horizontal margins of block boxes do not collapse. +# These block boxes are actually floats - in CSS 2.1 there is no other +# method to create horizontally adjacent block boxes. +== block-horizontal-1.html block-horizontal-1.html +== block-horizontal-1.html block-horizontal-1.html +== block-horizontal-2.html block-horizontal-2.html +== block-horizontal-2.html block-horizontal-2.html +== block-horizontal-3.html block-horizontal-3.html +== block-horizontal-3.html block-horizontal-3.html +== block-horizontal-4.html block-horizontal-4.html +== block-horizontal-4.html block-horizontal-4.html +skip-if(B2G||Mulet) == block-horizontal-1-dyn.html block-horizontal-1-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== block-horizontal-1-dyn.html block-horizontal-1-dyn.html +skip-if(B2G||Mulet) == block-horizontal-2-dyn.html block-horizontal-2-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== block-horizontal-2-dyn.html block-horizontal-2-dyn.html +skip-if(B2G||Mulet) == block-horizontal-3-dyn.html block-horizontal-3-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== block-horizontal-3-dyn.html block-horizontal-3-dyn.html +skip-if(B2G||Mulet) == block-horizontal-4-dyn.html block-horizontal-4-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== block-horizontal-4-dyn.html block-horizontal-4-dyn.html +# Horizontal margins of inline-block boxes do not collapse. +== inline-block-horizontal-1.html inline-block-horizontal-1.html +== inline-block-horizontal-1.html inline-block-horizontal-1.html +== inline-block-horizontal-2.html inline-block-horizontal-2.html +== inline-block-horizontal-2.html inline-block-horizontal-2.html +skip-if(B2G||Mulet) == inline-block-horizontal-1-dyn.html inline-block-horizontal-1-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== inline-block-horizontal-1-dyn.html inline-block-horizontal-1-dyn.html +skip-if(B2G||Mulet) == inline-block-horizontal-2-dyn.html inline-block-horizontal-2-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== inline-block-horizontal-2-dyn.html inline-block-horizontal-2-dyn.html +# Horizontal margins of inline-tables do not collapse. +skip == inline-table-horizontal-1.html inline-table-horizontal-1.html +skip == inline-table-horizontal-1.html inline-table-horizontal-1.html +skip-if(B2G||Mulet) == inline-table-horizontal-1-dyn.html inline-table-horizontal-1-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== inline-table-horizontal-1-dyn.html inline-table-horizontal-1-dyn.html +# "In CSS, the adjoining margins of two or more boxes +# (which might or might not be siblings) can combine to form a single margin. +# Margins that combine this way are said to collapse, +# and the resulting combined margin is called a collapsed margin." +# "Two margins are adjoining if and only if:" [...] +# "both belong to vertically-adjacent box edges, +# i.e. form one of the following pairs:" [...] +# "bottom margin of box and top margin of its next in-flow following sibling" +# "When two or more margins collapse, +# the resulting margin width is the maximum of the collapsing margins' widths." +# The margins of two in-flow siblings should collapse. +# These tests feature margins of different or equal sizes on each box. +# The norefs depict incorrect results where the margins did not collapse. +== block-sibling-1a.html block-sibling-1a.html +== block-sibling-1a.html block-sibling-1a.html +== block-sibling-1a.html block-sibling-1a.html +== block-sibling-1b.html block-sibling-1b.html +== block-sibling-1b.html block-sibling-1b.html +== block-sibling-1b.html block-sibling-1b.html +== block-sibling-1c.html block-sibling-1c.html +== block-sibling-1c.html block-sibling-1c.html +== block-sibling-1c.html block-sibling-1c.html +== block-sibling-2.html block-sibling-2.html +== block-sibling-2.html block-sibling-2.html +== block-sibling-2.html block-sibling-2.html +== block-sibling-3.html block-sibling-3.html +== block-sibling-3.html block-sibling-3.html +== block-sibling-3.html block-sibling-3.html +== block-sibling-1a-dyn.html block-sibling-1a-dyn.html +== block-sibling-1a-dyn.html block-sibling-1a-dyn.html +== block-sibling-1a-dyn.html block-sibling-1a-dyn.html +== block-sibling-1b-dyn.html block-sibling-1b-dyn.html +== block-sibling-1b-dyn.html block-sibling-1b-dyn.html +== block-sibling-1b-dyn.html block-sibling-1b-dyn.html +== block-sibling-1c-dyn.html block-sibling-1c-dyn.html +== block-sibling-1c-dyn.html block-sibling-1c-dyn.html +== block-sibling-1c-dyn.html block-sibling-1c-dyn.html +skip-if(B2G||Mulet) == block-sibling-2-dyn.html block-sibling-2-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== block-sibling-2-dyn.html block-sibling-2-dyn.html +== block-sibling-2-dyn.html block-sibling-2-dyn.html +== block-sibling-3-dyn.html block-sibling-3-dyn.html +== block-sibling-3-dyn.html block-sibling-3-dyn.html +== block-sibling-3-dyn.html block-sibling-3-dyn.html +# "In the case of negative margins, the maximum of the absolute values of the +# negative adjoining margins is deducted from the maximum of the positive +# adjoining margins. If there are no positive margins, the maximum of the +# absolute values of the adjoining margins is deducted from zero." +# These tests feature sibling block boxes where one or two margins are negative. +# The norefs depict possible incorrect addition or subtraction of margins. +== block-negative-1a.html block-negative-1a.html +== block-negative-1a.html block-negative-1a.html +== block-negative-1a.html block-negative-1a.html +== block-negative-1b.html block-negative-1b.html +== block-negative-1b.html block-negative-1b.html +== block-negative-1b.html block-negative-1b.html +== block-negative-2a.html block-negative-2a.html +== block-negative-2a.html block-negative-2a.html +== block-negative-2a.html block-negative-2a.html +== block-negative-2b.html block-negative-2b.html +== block-negative-2b.html block-negative-2b.html +== block-negative-2b.html block-negative-2b.html +== block-negative-3a.html block-negative-3a.html +== block-negative-3a.html block-negative-3a.html +== block-negative-3a.html block-negative-3a.html +== block-negative-3a.html block-negative-3a.html +== block-negative-3b.html block-negative-3b.html +== block-negative-3b.html block-negative-3b.html +== block-negative-3b.html block-negative-3b.html +== block-negative-3b.html block-negative-3b.html +== block-negative-4a.html block-negative-4a.html +== block-negative-4a.html block-negative-4a.html +== block-negative-4a.html block-negative-4a.html +== block-negative-4a.html block-negative-4a.html +== block-negative-4b.html block-negative-4b.html +== block-negative-4b.html block-negative-4b.html +== block-negative-4b.html block-negative-4b.html +== block-negative-4b.html block-negative-4b.html +== block-negative-5.html block-negative-5.html +== block-negative-5.html block-negative-5.html +== block-negative-5.html block-negative-5.html +== block-negative-5.html block-negative-5.html +== block-negative-1a-dyn1.html block-negative-1a-dyn1.html +== block-negative-1a-dyn1.html block-negative-1a-dyn1.html +== block-negative-1a-dyn1.html block-negative-1a-dyn1.html +== block-negative-1a-dyn2.html block-negative-1a-dyn2.html +== block-negative-1a-dyn2.html block-negative-1a-dyn2.html +== block-negative-1a-dyn2.html block-negative-1a-dyn2.html +== block-negative-1b-dyn1.html block-negative-1b-dyn1.html +== block-negative-1b-dyn1.html block-negative-1b-dyn1.html +== block-negative-1b-dyn1.html block-negative-1b-dyn1.html +== block-negative-1b-dyn2.html block-negative-1b-dyn2.html +== block-negative-1b-dyn2.html block-negative-1b-dyn2.html +== block-negative-1b-dyn2.html block-negative-1b-dyn2.html +== block-negative-2a-dyn1.html block-negative-2a-dyn1.html +== block-negative-2a-dyn1.html block-negative-2a-dyn1.html +== block-negative-2a-dyn1.html block-negative-2a-dyn1.html +== block-negative-2a-dyn2.html block-negative-2a-dyn2.html +== block-negative-2a-dyn2.html block-negative-2a-dyn2.html +== block-negative-2a-dyn2.html block-negative-2a-dyn2.html +== block-negative-2b-dyn1.html block-negative-2b-dyn1.html +== block-negative-2b-dyn1.html block-negative-2b-dyn1.html +== block-negative-2b-dyn1.html block-negative-2b-dyn1.html +== block-negative-2b-dyn2.html block-negative-2b-dyn2.html +== block-negative-2b-dyn2.html block-negative-2b-dyn2.html +== block-negative-2b-dyn2.html block-negative-2b-dyn2.html +== block-negative-3a-dyn1.html block-negative-3a-dyn1.html +== block-negative-3a-dyn1.html block-negative-3a-dyn1.html +== block-negative-3a-dyn1.html block-negative-3a-dyn1.html +== block-negative-3a-dyn1.html block-negative-3a-dyn1.html +== block-negative-3a-dyn2.html block-negative-3a-dyn2.html +== block-negative-3a-dyn2.html block-negative-3a-dyn2.html +== block-negative-3a-dyn2.html block-negative-3a-dyn2.html +== block-negative-3a-dyn2.html block-negative-3a-dyn2.html +== block-negative-3b-dyn1.html block-negative-3b-dyn1.html +== block-negative-3b-dyn1.html block-negative-3b-dyn1.html +== block-negative-3b-dyn1.html block-negative-3b-dyn1.html +== block-negative-3b-dyn1.html block-negative-3b-dyn1.html +== block-negative-3b-dyn2.html block-negative-3b-dyn2.html +== block-negative-3b-dyn2.html block-negative-3b-dyn2.html +== block-negative-3b-dyn2.html block-negative-3b-dyn2.html +== block-negative-3b-dyn2.html block-negative-3b-dyn2.html +== block-negative-4a-dyn1.html block-negative-4a-dyn1.html +== block-negative-4a-dyn1.html block-negative-4a-dyn1.html +== block-negative-4a-dyn1.html block-negative-4a-dyn1.html +== block-negative-4a-dyn1.html block-negative-4a-dyn1.html +== block-negative-4a-dyn2.html block-negative-4a-dyn2.html +== block-negative-4a-dyn2.html block-negative-4a-dyn2.html +== block-negative-4a-dyn2.html block-negative-4a-dyn2.html +== block-negative-4a-dyn2.html block-negative-4a-dyn2.html +== block-negative-4b-dyn1.html block-negative-4b-dyn1.html +== block-negative-4b-dyn1.html block-negative-4b-dyn1.html +== block-negative-4b-dyn1.html block-negative-4b-dyn1.html +== block-negative-4b-dyn1.html block-negative-4b-dyn1.html +== block-negative-4b-dyn2.html block-negative-4b-dyn2.html +== block-negative-4b-dyn2.html block-negative-4b-dyn2.html +== block-negative-4b-dyn2.html block-negative-4b-dyn2.html +== block-negative-4b-dyn2.html block-negative-4b-dyn2.html +== block-negative-5-dyn1.html block-negative-5-dyn1.html +== block-negative-5-dyn1.html block-negative-5-dyn1.html +== block-negative-5-dyn1.html block-negative-5-dyn1.html +== block-negative-5-dyn1.html block-negative-5-dyn1.html +== block-negative-5-dyn2.html block-negative-5-dyn2.html +== block-negative-5-dyn2.html block-negative-5-dyn2.html +== block-negative-5-dyn2.html block-negative-5-dyn2.html +== block-negative-5-dyn2.html block-negative-5-dyn2.html +# "Two margins are adjoining if and only if:" [...] +# "both belong to vertically-adjacent box edges, +# i.e. form one of the following pairs:" [...] +# "top margin of a box and top margin of its first in-flow child" +# "bottom margin of a last in-flow child and bottom margin of its parent +# if the parent has 'auto' computed height" +# "A collapsed margin is considered adjoining to another margin if +# any of its component margins is adjoining to that margin." +# "Note. Adjoining margins can be generated by elements that are +# not related as siblings or ancestors." +# These tests check whether margins are correctly collapsed even when the +# boxes participating are not related as siblings or ancestors. +# The tests feature different sizes of margins on different boxes. +== block-non-sibling-1a.html block-non-sibling-1a.html +== block-non-sibling-1a.html block-non-sibling-1a.html +== block-non-sibling-1b.html block-non-sibling-1b.html +== block-non-sibling-1b.html block-non-sibling-1b.html +== block-non-sibling-1c.html block-non-sibling-1c.html +== block-non-sibling-1c.html block-non-sibling-1c.html +skip == block-non-sibling-1d.html block-non-sibling-1d.html +skip == block-non-sibling-1d.html block-non-sibling-1d.html +== block-non-sibling-1e.html block-non-sibling-1e.html +== block-non-sibling-1e.html block-non-sibling-1e.html +== block-non-sibling-1f.html block-non-sibling-1f.html +== block-non-sibling-1f.html block-non-sibling-1f.html +== block-non-sibling-2a.html block-non-sibling-2a.html +== block-non-sibling-2a.html block-non-sibling-2a.html +== block-non-sibling-2b.html block-non-sibling-2b.html +== block-non-sibling-2b.html block-non-sibling-2b.html +== block-non-sibling-2c.html block-non-sibling-2c.html +== block-non-sibling-2c.html block-non-sibling-2c.html +== block-non-sibling-2d.html block-non-sibling-2d.html +== block-non-sibling-2d.html block-non-sibling-2d.html +== block-non-sibling-2e.html block-non-sibling-2e.html +== block-non-sibling-2e.html block-non-sibling-2e.html +== block-non-sibling-2f.html block-non-sibling-2f.html +== block-non-sibling-2f.html block-non-sibling-2f.html +== block-non-sibling-3a.html block-non-sibling-3a.html +== block-non-sibling-3a.html block-non-sibling-3a.html +== block-non-sibling-3b.html block-non-sibling-3b.html +== block-non-sibling-3b.html block-non-sibling-3b.html +skip == block-non-sibling-3c.html block-non-sibling-3c.html +skip == block-non-sibling-3c.html block-non-sibling-3c.html +== block-non-sibling-3d.html block-non-sibling-3d.html +== block-non-sibling-3d.html block-non-sibling-3d.html +== block-non-sibling-4.html block-non-sibling-4.html +== block-non-sibling-4.html block-non-sibling-4.html +== block-non-sibling-1a-dyn.html block-non-sibling-1a-dyn.html +== block-non-sibling-1b-dyn.html block-non-sibling-1b-dyn.html +== block-non-sibling-1c-dyn.html block-non-sibling-1c-dyn.html +== block-non-sibling-1d-dyn.html block-non-sibling-1d-dyn.html +== block-non-sibling-1e-dyn.html block-non-sibling-1e-dyn.html +== block-non-sibling-1f-dyn.html block-non-sibling-1f-dyn.html +== block-non-sibling-2a-dyn.html block-non-sibling-2a-dyn.html +== block-non-sibling-2b-dyn.html block-non-sibling-2b-dyn.html +== block-non-sibling-2c-dyn.html block-non-sibling-2c-dyn.html +== block-non-sibling-2d-dyn.html block-non-sibling-2d-dyn.html +== block-non-sibling-2e-dyn.html block-non-sibling-2e-dyn.html +== block-non-sibling-2f-dyn.html block-non-sibling-2f-dyn.html +== block-non-sibling-3a-dyn.html block-non-sibling-3a-dyn.html +== block-non-sibling-3b-dyn.html block-non-sibling-3b-dyn.html +== block-non-sibling-3c-dyn.html block-non-sibling-3c-dyn.html +== block-non-sibling-3d-dyn.html block-non-sibling-3d-dyn.html +== block-non-sibling-4-dyn.html block-non-sibling-4-dyn.html +# The first-child series tests cases where the top margin of a box collapses +# with the top margin of its parent element. +# This series is more extensive than the non-sibling series, because +# various combinations of positive and negative margins are tested. +== block-first-child-1a.html block-first-child-1a.html +== block-first-child-1b.html block-first-child-1b.html +== block-first-child-1c.html block-first-child-1c.html +== block-first-child-2.html block-first-child-2.html +== block-first-child-3.html block-first-child-3.html +== block-first-child-4.html block-first-child-4.html +== block-first-child-5.html block-first-child-5.html +== block-first-child-6.html block-first-child-6.html +== block-first-child-7.html block-first-child-7.html +== block-first-child-8a.html block-first-child-8a.html +== block-first-child-8b.html block-first-child-8b.html +== block-first-child-8c.html block-first-child-8c.html +== block-first-child-1a-dyn.html block-first-child-1a-dyn.html +== block-first-child-1b-dyn.html block-first-child-1b-dyn.html +# == block-first-child-1c-dyn.html block-first-child-1c-dyn.html +== block-first-child-2-dyn.html block-first-child-2-dyn.html +== block-first-child-3-dyn.html block-first-child-3-dyn.html +== block-first-child-4-dyn.html block-first-child-4-dyn.html +== block-first-child-5-dyn.html block-first-child-5-dyn.html +== block-first-child-6-dyn.html block-first-child-6-dyn.html +== block-first-child-7-dyn.html block-first-child-7-dyn.html +== block-first-child-8a-dyn.html block-first-child-8a-dyn.html +== block-first-child-8b-dyn.html block-first-child-8b-dyn.html +== block-first-child-8c-dyn.html block-first-child-8c-dyn.html +# "The bottom margin of an in-flow block box with a 'height' of 'auto' +# collapses with its last in-flow block-level child's bottom margin" +# Note: The block-auto-height-last-child series automatically covers +# all cases where 'min-height' is '0' and 'max-height' is 'none' as +# these are the default values of those properties. +== block-auto-height-last-child-1a.html block-auto-height-last-child-1a.html +== block-auto-height-last-child-1b.html block-auto-height-last-child-1b.html +== block-auto-height-last-child-1c.html block-auto-height-last-child-1c.html +skip == block-auto-height-last-child-2.html block-auto-height-last-child-2.html +== block-auto-height-last-child-3.html block-auto-height-last-child-3.html +== block-auto-height-last-child-4.html block-auto-height-last-child-4.html +== block-auto-height-last-child-5.html block-auto-height-last-child-5.html +== block-auto-height-last-child-6.html block-auto-height-last-child-6.html +== block-auto-height-last-child-7.html block-auto-height-last-child-7.html +== block-auto-height-last-child-8a.html block-auto-height-last-child-8a.html +== block-auto-height-last-child-8b.html block-auto-height-last-child-8b.html +== block-auto-height-last-child-8c.html block-auto-height-last-child-8c.html +== block-auto-height-last-child-1a-dyn.html block-auto-height-last-child-1a-dyn.html +== block-auto-height-last-child-1b-dyn.html block-auto-height-last-child-1b-dyn.html +== block-auto-height-last-child-1c-dyn.html block-auto-height-last-child-1c-dyn.html +== block-auto-height-last-child-2-dyn.html block-auto-height-last-child-2-dyn.html +== block-auto-height-last-child-3-dyn.html block-auto-height-last-child-3-dyn.html +== block-auto-height-last-child-4-dyn.html block-auto-height-last-child-4-dyn.html +== block-auto-height-last-child-5-dyn.html block-auto-height-last-child-5-dyn.html +== block-auto-height-last-child-6-dyn.html block-auto-height-last-child-6-dyn.html +== block-auto-height-last-child-7-dyn.html block-auto-height-last-child-7-dyn.html +== block-auto-height-last-child-8a-dyn.html block-auto-height-last-child-8a-dyn.html +== block-auto-height-last-child-8b-dyn.html block-auto-height-last-child-8b-dyn.html +== block-auto-height-last-child-8c-dyn.html block-auto-height-last-child-8c-dyn.html +# The last-child series is an older variant of the +# block-auto-height-last-child tests. +== block-last-child-1a.html block-last-child-1a.html +== block-last-child-1b.html block-last-child-1b.html +== block-last-child-1c.html block-last-child-1c.html +== block-last-child-2a.html block-last-child-2a.html +== block-last-child-2b.html block-last-child-2b.html +== block-last-child-2c.html block-last-child-2c.html +== block-last-child-2d.html block-last-child-2d.html +== block-last-child-3a.html block-last-child-3a.html +== block-last-child-3b.html block-last-child-3b.html +== block-last-child-3c.html block-last-child-3c.html +== block-last-child-3d.html block-last-child-3d.html +== block-last-child-4a.html block-last-child-4a.html +== block-last-child-4b.html block-last-child-4b.html +== block-last-child-4c.html block-last-child-4c.html +== block-last-child-4d.html block-last-child-4d.html +# There's also the older block-zero-min-height series which explicitly +# adds min-height: 0; to boxes with height: auto; +# This should have no effect on margin-collapsing. +== block-zero-min-height-1a.html block-zero-min-height-1a.html +== block-zero-min-height-1b.html block-zero-min-height-1b.html +== block-zero-min-height-1c.html block-zero-min-height-1c.html +== block-zero-min-height-1d.html block-zero-min-height-1d.html +== block-zero-min-height-1e.html block-zero-min-height-1e.html +== block-zero-min-height-1f.html block-zero-min-height-1f.html +== block-zero-min-height-1a.html block-zero-min-height-1a.html +== block-zero-min-height-1b.html block-zero-min-height-1b.html +== block-zero-min-height-1c.html block-zero-min-height-1c.html +== block-zero-min-height-1d.html block-zero-min-height-1d.html +== block-zero-min-height-1e.html block-zero-min-height-1e.html +== block-zero-min-height-1f.html block-zero-min-height-1f.html +== block-zero-min-height-2a.html block-zero-min-height-2a.html +== block-zero-min-height-2b.html block-zero-min-height-2b.html +== block-zero-min-height-2c.html block-zero-min-height-2c.html +== block-zero-min-height-2d.html block-zero-min-height-2d.html +== block-zero-min-height-2e.html block-zero-min-height-2e.html +== block-zero-min-height-2f.html block-zero-min-height-2f.html +== block-zero-min-height-2a.html block-zero-min-height-2a.html +== block-zero-min-height-2b.html block-zero-min-height-2b.html +== block-zero-min-height-2c.html block-zero-min-height-2c.html +== block-zero-min-height-2d.html block-zero-min-height-2d.html +== block-zero-min-height-2e.html block-zero-min-height-2e.html +== block-zero-min-height-2f.html block-zero-min-height-2f.html +== block-zero-min-height-3a.html block-zero-min-height-3a.html +== block-zero-min-height-3b.html block-zero-min-height-3b.html +== block-zero-min-height-3c.html block-zero-min-height-3c.html +== block-zero-min-height-3d.html block-zero-min-height-3d.html +# If a parent box's height is 'auto' and its 'min-height' is non-zero, +# then its bottom margin collapses with its last-child's bottom margin. +# This is true even if the two margins do not actually touch each other, +# as they are still considered 'adjoining'. +== block-min-height-last-child-1a.html block-min-height-last-child-1a.html +# Bug 616339 +== block-min-height-last-child-1b.html block-min-height-last-child-1b.html +== block-min-height-last-child-1c.html block-min-height-last-child-1c.html +== block-min-height-last-child-2a.html block-min-height-last-child-2a.html +# Bug 616339 +== block-min-height-last-child-2b.html block-min-height-last-child-2b.html +# Bug 616339 +== block-min-height-last-child-3a.html block-min-height-last-child-3a.html +# Bug 616339 +== block-min-height-last-child-3b.html block-min-height-last-child-3b.html +== block-min-height-last-child-3c.html block-min-height-last-child-3c.html +== block-min-height-last-child-4a.html block-min-height-last-child-4a.html +== block-min-height-last-child-4b.html block-min-height-last-child-4b.html +== block-min-height-last-child-4c.html block-min-height-last-child-4c.html +== block-min-height-last-child-5a.html block-min-height-last-child-5a.html +== block-min-height-last-child-5b.html block-min-height-last-child-5b.html +== block-min-height-last-child-6a.html block-min-height-last-child-6a.html +== block-min-height-last-child-6b.html block-min-height-last-child-6b.html +== block-min-height-last-child-6c.html block-min-height-last-child-6c.html +== block-min-height-last-child-7a.html block-min-height-last-child-7a.html +== block-min-height-last-child-7b.html block-min-height-last-child-7b.html +== block-min-height-last-child-7c.html block-min-height-last-child-7c.html +== block-min-height-last-child-8a.html block-min-height-last-child-8a.html +== block-min-height-last-child-8b.html block-min-height-last-child-8b.html +== block-min-height-last-child-9a.html block-min-height-last-child-9a.html +== block-min-height-last-child-9b.html block-min-height-last-child-9b.html +== block-min-height-last-child-9c.html block-min-height-last-child-9c.html +== block-min-height-last-child-1a-dyn.html block-min-height-last-child-1a-dyn.html +# Bug 616339 +== block-min-height-last-child-1b-dyn.html block-min-height-last-child-1b-dyn.html +== block-min-height-last-child-1c-dyn.html block-min-height-last-child-1c-dyn.html +== block-min-height-last-child-2a-dyn.html block-min-height-last-child-2a-dyn.html +# Bug 616339 +== block-min-height-last-child-2b-dyn.html block-min-height-last-child-2b-dyn.html +# Bug 616339 +== block-min-height-last-child-3a-dyn.html block-min-height-last-child-3a-dyn.html +# Bug 616339 +== block-min-height-last-child-3b-dyn.html block-min-height-last-child-3b-dyn.html +== block-min-height-last-child-3c-dyn.html block-min-height-last-child-3c-dyn.html +== block-min-height-last-child-4a-dyn.html block-min-height-last-child-4a-dyn.html +== block-min-height-last-child-4b-dyn.html block-min-height-last-child-4b-dyn.html +== block-min-height-last-child-4c-dyn.html block-min-height-last-child-4c-dyn.html +== block-min-height-last-child-5a-dyn.html block-min-height-last-child-5a-dyn.html +== block-min-height-last-child-5b-dyn.html block-min-height-last-child-5b-dyn.html +== block-min-height-last-child-6a-dyn.html block-min-height-last-child-6a-dyn.html +== block-min-height-last-child-6b-dyn.html block-min-height-last-child-6b-dyn.html +== block-min-height-last-child-6c-dyn.html block-min-height-last-child-6c-dyn.html +== block-min-height-last-child-7a-dyn.html block-min-height-last-child-7a-dyn.html +== block-min-height-last-child-7b-dyn.html block-min-height-last-child-7b-dyn.html +== block-min-height-last-child-7c-dyn.html block-min-height-last-child-7c-dyn.html +== block-min-height-last-child-8a-dyn.html block-min-height-last-child-8a-dyn.html +== block-min-height-last-child-8b-dyn.html block-min-height-last-child-8b-dyn.html +== block-min-height-last-child-9a-dyn.html block-min-height-last-child-9a-dyn.html +== block-min-height-last-child-9b-dyn.html block-min-height-last-child-9b-dyn.html +== block-min-height-last-child-9c-dyn.html block-min-height-last-child-9c-dyn.html +# If a parent box's height is 'auto' and its 'max-height' is not 'none' +# then its bottom margin collapses with its last-child's bottom margin. +# According to CSS 2.1 §10.7 (Minimum and maximum heights) this is true, +# even if the descendant's height is bigger than the defined max-height. +== block-max-height-last-child-1a.html block-max-height-last-child-1a.html +== block-max-height-last-child-1b.html block-max-height-last-child-1b.html +== block-max-height-last-child-1c.html block-max-height-last-child-1c.html +== block-max-height-last-child-2a.html block-max-height-last-child-2a.html +== block-max-height-last-child-2b.html block-max-height-last-child-2b.html +== block-max-height-last-child-3a.html block-max-height-last-child-3a.html +== block-max-height-last-child-3b.html block-max-height-last-child-3b.html +== block-max-height-last-child-3c.html block-max-height-last-child-3c.html +== block-max-height-last-child-4a.html block-max-height-last-child-4a.html +== block-max-height-last-child-4b.html block-max-height-last-child-4b.html +== block-max-height-last-child-4c.html block-max-height-last-child-4c.html +== block-max-height-last-child-5a.html block-max-height-last-child-5a.html +== block-max-height-last-child-5b.html block-max-height-last-child-5b.html +== block-max-height-last-child-6a.html block-max-height-last-child-6a.html +== block-max-height-last-child-6b.html block-max-height-last-child-6b.html +== block-max-height-last-child-6c.html block-max-height-last-child-6c.html +== block-max-height-last-child-7a.html block-max-height-last-child-7a.html +# Bug 616339 +== block-max-height-last-child-7b.html block-max-height-last-child-7b.html +== block-max-height-last-child-7c.html block-max-height-last-child-7c.html +== block-max-height-last-child-8a.html block-max-height-last-child-8a.html +# Bug 616339 +== block-max-height-last-child-8b.html block-max-height-last-child-8b.html +# Bug 616339 +== block-max-height-last-child-9a.html block-max-height-last-child-9a.html +# Bug 616339 +== block-max-height-last-child-9b.html block-max-height-last-child-9b.html +== block-max-height-last-child-9c.html block-max-height-last-child-9c.html +== block-max-height-last-child-1a-dyn.html block-max-height-last-child-1a-dyn.html +== block-max-height-last-child-1b-dyn.html block-max-height-last-child-1b-dyn.html +== block-max-height-last-child-1c-dyn.html block-max-height-last-child-1c-dyn.html +== block-max-height-last-child-2a-dyn.html block-max-height-last-child-2a-dyn.html +== block-max-height-last-child-2b-dyn.html block-max-height-last-child-2b-dyn.html +== block-max-height-last-child-3a-dyn.html block-max-height-last-child-3a-dyn.html +== block-max-height-last-child-3b-dyn.html block-max-height-last-child-3b-dyn.html +== block-max-height-last-child-3c-dyn.html block-max-height-last-child-3c-dyn.html +== block-max-height-last-child-4a-dyn.html block-max-height-last-child-4a-dyn.html +== block-max-height-last-child-4b-dyn.html block-max-height-last-child-4b-dyn.html +== block-max-height-last-child-4c-dyn.html block-max-height-last-child-4c-dyn.html +== block-max-height-last-child-5a-dyn.html block-max-height-last-child-5a-dyn.html +== block-max-height-last-child-5b-dyn.html block-max-height-last-child-5b-dyn.html +== block-max-height-last-child-6a-dyn.html block-max-height-last-child-6a-dyn.html +== block-max-height-last-child-6b-dyn.html block-max-height-last-child-6b-dyn.html +== block-max-height-last-child-6c-dyn.html block-max-height-last-child-6c-dyn.html +== block-max-height-last-child-7a-dyn.html block-max-height-last-child-7a-dyn.html +# Bug 616339 +== block-max-height-last-child-7b-dyn.html block-max-height-last-child-7b-dyn.html +== block-max-height-last-child-7c-dyn.html block-max-height-last-child-7c-dyn.html +== block-max-height-last-child-8a-dyn.html block-max-height-last-child-8a-dyn.html +# Bug 616339 +== block-max-height-last-child-8b-dyn.html block-max-height-last-child-8b-dyn.html +# Bug 616339 +== block-max-height-last-child-9a-dyn.html block-max-height-last-child-9a-dyn.html +# Bug 616339 +== block-max-height-last-child-9b-dyn.html block-max-height-last-child-9b-dyn.html +== block-max-height-last-child-9c-dyn.html block-max-height-last-child-9c-dyn.html +# If a parent box's height is not 'auto' then its bottom margin +# never collapses with its last-child's bottom margin, +# as these margins are not considered 'adjoining'. +# According to CSS 2.1 §10.7 (Minimum and maximum heights) this is true, +# even if the value of min- or max-height is used instead. +== block-fix-height-last-child-1a.html block-fix-height-last-child-1a.html +== block-fix-height-last-child-1b.html block-fix-height-last-child-1b.html +== block-fix-height-last-child-2a.html block-fix-height-last-child-2a.html +== block-fix-height-last-child-2b.html block-fix-height-last-child-2b.html +skip == block-fix-height-last-child-3a.html block-fix-height-last-child-3a.html +== block-fix-height-last-child-3b.html block-fix-height-last-child-3b.html +== block-fix-height-last-child-4a.html block-fix-height-last-child-4a.html +== block-fix-height-last-child-4b.html block-fix-height-last-child-4b.html +== block-fix-height-last-child-4c.html block-fix-height-last-child-4c.html +== block-fix-height-last-child-4d.html block-fix-height-last-child-4d.html +== block-fix-height-last-child-4e.html block-fix-height-last-child-4e.html +== block-fix-height-last-child-4f.html block-fix-height-last-child-4f.html +== block-fix-height-last-child-4g.html block-fix-height-last-child-4g.html +== block-fix-height-last-child-4h.html block-fix-height-last-child-4h.html +== block-fix-height-last-child-1a-dyn.html block-fix-height-last-child-1a-dyn.html +== block-fix-height-last-child-1b-dyn.html block-fix-height-last-child-1b-dyn.html +== block-fix-height-last-child-2a-dyn.html block-fix-height-last-child-2a-dyn.html +== block-fix-height-last-child-2b-dyn.html block-fix-height-last-child-2b-dyn.html +== block-fix-height-last-child-3a-dyn.html block-fix-height-last-child-3a-dyn.html +== block-fix-height-last-child-3b-dyn.html block-fix-height-last-child-3b-dyn.html +== block-fix-height-last-child-4a-dyn.html block-fix-height-last-child-4a-dyn.html +== block-fix-height-last-child-4b-dyn.html block-fix-height-last-child-4b-dyn.html +== block-fix-height-last-child-4c-dyn.html block-fix-height-last-child-4c-dyn.html +== block-fix-height-last-child-4d-dyn.html block-fix-height-last-child-4d-dyn.html +== block-fix-height-last-child-4e-dyn.html block-fix-height-last-child-4e-dyn.html +== block-fix-height-last-child-4f-dyn.html block-fix-height-last-child-4f-dyn.html +== block-fix-height-last-child-4g-dyn.html block-fix-height-last-child-4g-dyn.html +== block-fix-height-last-child-4h-dyn.html block-fix-height-last-child-4h-dyn.html +# "Two margins are adjoining if and only if:" [...] +# "both belong to vertically-adjacent box edges, +# i.e. form one of the following pairs:" [...] +# "top and bottom margins of a box that does not establish a new block +# formatting context and that has zero computed 'min-height', zero or +# 'auto' computed 'height', and no in-flow children" +# Note that "if the top and bottom margins of a box are adjoining, then it is +# possible for margins to collapse through it." +# I.e. a parent's top and bottom margin are still considered adjoining if +# they collapse through their in-flow children's margins. +== block-no-content-1a.html block-no-content-1a.html +== block-no-content-1b.html block-no-content-1b.html +== block-no-content-1c.html block-no-content-1c.html +== block-no-content-1d.html block-no-content-1d.html +== block-no-content-2a.html block-no-content-2a.html +== block-no-content-2b.html block-no-content-2b.html +== block-no-content-2c.html block-no-content-2c.html +== block-no-content-2d.html block-no-content-2d.html +== block-no-content-2e.html block-no-content-2e.html +== block-no-content-3a.html block-no-content-3a.html +== block-no-content-3b.html block-no-content-3b.html +== block-no-content-3c.html block-no-content-3c.html +== block-no-content-4a.html block-no-content-4a.html +== block-no-content-4b.html block-no-content-4b.html +== block-no-content-4c.html block-no-content-4c.html +== block-no-content-5a.html block-no-content-5a.html +== block-no-content-5b.html block-no-content-5b.html +== block-no-content-6.html block-no-content-6.html +== block-no-content-7.html block-no-content-7.html +# "If the top margin of a box with non-zero computed 'min-height' and 'auto' +# computed 'height' collapses with the bottom margin of its last in-flow +# child, then the child's bottom margin does not collapse with the parent's +# bottom margin." +== block-no-content-8.html block-no-content-8.html +== block-no-content-1a-dyn.html block-no-content-1a-dyn.html +skip == block-no-content-1b-dyn.html block-no-content-1b-dyn.html +== block-no-content-1c-dyn.html block-no-content-1c-dyn.html +== block-no-content-1d-dyn.html block-no-content-1d-dyn.html +== block-no-content-2a-dyn.html block-no-content-2a-dyn.html +== block-no-content-2b-dyn.html block-no-content-2b-dyn.html +== block-no-content-2c-dyn.html block-no-content-2c-dyn.html +== block-no-content-2d-dyn.html block-no-content-2d-dyn.html +== block-no-content-2e-dyn.html block-no-content-2e-dyn.html +== block-no-content-3a-dyn.html block-no-content-3a-dyn.html +== block-no-content-3b-dyn.html block-no-content-3b-dyn.html +== block-no-content-3c-dyn.html block-no-content-3c-dyn.html +== block-no-content-4a-dyn.html block-no-content-4a-dyn.html +== block-no-content-4b-dyn.html block-no-content-4b-dyn.html +== block-no-content-4c-dyn.html block-no-content-4c-dyn.html +== block-no-content-5a-dyn.html block-no-content-5a-dyn.html +== block-no-content-5b-dyn.html block-no-content-5b-dyn.html +skip == block-no-content-6-dyn.html block-no-content-6-dyn.html +== block-no-content-7-dyn.html block-no-content-7-dyn.html +== block-no-content-8-dyn.html block-no-content-8-dyn.html +# These tests are similar to the no-content ones, except that some boxes +# have height: 0; declared on them. +skip == block-zero-height-1a.html block-zero-height-1a.html +== block-zero-height-1b.html block-zero-height-1b.html +== block-zero-height-2a.html block-zero-height-2a.html +== block-zero-height-2b.html block-zero-height-2b.html +== block-zero-height-2c.html block-zero-height-2c.html +== block-zero-height-3a.html block-zero-height-3a.html +== block-zero-height-3b.html block-zero-height-3b.html +== block-zero-height-3c.html block-zero-height-3c.html +# "Margins of elements that establish new block formatting contexts ([...]) +# do not collapse with their in-flow children." +# The margins of a block formatting context can collapse with margins of +# in-flow sibling boxes, but not with margins of their in-flow children. +# Elements that establish a block formatting context are: +# * "elements with 'overflow' other than 'visible'" +== block-overflow-1.html block-overflow-1.html +== block-overflow-1.html block-overflow-1.html +== block-overflow-2.html block-overflow-2.html +== block-overflow-2.html block-overflow-2.html +skip-if(B2G||Mulet) == block-overflow-3.html block-overflow-3.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +skip-if(B2G||Mulet) == block-overflow-3.html block-overflow-3.html +# Initial mulet triage: parity with B2G/B2G Desktop +skip-if(B2G||Mulet) == block-overflow-4.html block-overflow-4.html +# Initial mulet triage: parity with B2G/B2G Desktop +skip-if(B2G||Mulet) == block-overflow-4.html block-overflow-4.html +# Initial mulet triage: parity with B2G/B2G Desktop +== block-overflow-5a.html block-overflow-5a.html +== block-overflow-5a.html block-overflow-5a.html +== block-overflow-5b.html block-overflow-5b.html +== block-overflow-5b.html block-overflow-5b.html +== block-overflow-5c.html block-overflow-5c.html +== block-overflow-5c.html block-overflow-5c.html +== block-overflow-5d.html block-overflow-5d.html +== block-overflow-5d.html block-overflow-5d.html +== block-overflow-1-dyn.html block-overflow-1-dyn.html +== block-overflow-2-dyn.html block-overflow-2-dyn.html +skip-if(B2G||Mulet) == block-overflow-3-dyn.html block-overflow-3-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +skip-if(B2G||Mulet) == block-overflow-4-dyn.html block-overflow-4-dyn.html +# Initial mulet triage: parity with B2G/B2G Desktop +== block-overflow-5a-dyn.html block-overflow-5a-dyn.html +== block-overflow-5b-dyn.html block-overflow-5b-dyn.html +== block-overflow-5c-dyn.html block-overflow-5c-dyn.html +== block-overflow-5d-dyn.html block-overflow-5d-dyn.html +# * 'fieldset' elements, per HTML5 (Candidate Recommendation 6 August 2013): +# §10.3.13 (The fieldset and legend elements): "The fieldset element is +# expected to establish a new block formatting context." +== fieldset-sibling-1a.html fieldset-sibling-1a.html +== fieldset-sibling-1b.html fieldset-sibling-1b.html +== fieldset-sibling-1c.html fieldset-sibling-1c.html +== fieldset-sibling-2a.html fieldset-sibling-2a.html +== fieldset-sibling-2b.html fieldset-sibling-2b.html +== fieldset-sibling-2c.html fieldset-sibling-2c.html +== fieldset-sibling-2a.html fieldset-sibling-2a.html +== fieldset-sibling-2b.html fieldset-sibling-2b.html +== fieldset-sibling-2c.html fieldset-sibling-2c.html +== fieldset-sibling-1a-dyn.html fieldset-sibling-1a-dyn.html +== fieldset-sibling-1b-dyn.html fieldset-sibling-1b-dyn.html +== fieldset-sibling-1c-dyn.html fieldset-sibling-1c-dyn.html +== fieldset-sibling-2a-dyn.html fieldset-sibling-2a-dyn.html +== fieldset-sibling-2b-dyn.html fieldset-sibling-2b-dyn.html +== fieldset-sibling-2c-dyn.html fieldset-sibling-2c-dyn.html +== fieldset-child-1.html fieldset-child-1.html +== fieldset-child-1-dyn.html fieldset-child-1-dyn.html +# * Tables, per CSS 2.1 §17.4 (Tables in the visual formatting model): +# "The table wrapper box establishes a block formatting context." +# "The table wrapper box is a 'block' box if the table is block-level [...]" +== table-sibling-1a.html table-sibling-1a.html +== table-sibling-1a.html table-sibling-1a.html +== table-sibling-1b.html table-sibling-1b.html +== table-sibling-1b.html table-sibling-1b.html +== table-sibling-1c.html table-sibling-1c.html +== table-sibling-1c.html table-sibling-1c.html +== table-sibling-2a.html table-sibling-2a.html +== table-sibling-2a.html table-sibling-2a.html +== table-sibling-2b.html table-sibling-2b.html +== table-sibling-2b.html table-sibling-2b.html +== table-sibling-2c.html table-sibling-2c.html +== table-sibling-2c.html table-sibling-2c.html +skip-if(B2G||Mulet) == table-sibling-1a-dyn.html table-sibling-1a-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== table-sibling-1a-dyn.html table-sibling-1a-dyn.html +skip-if(B2G||Mulet) == table-sibling-1b-dyn.html table-sibling-1b-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== table-sibling-1b-dyn.html table-sibling-1b-dyn.html +skip-if(B2G||Mulet) == table-sibling-1c-dyn.html table-sibling-1c-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== table-sibling-1c-dyn.html table-sibling-1c-dyn.html +skip-if(B2G||Mulet) == table-sibling-2a-dyn.html table-sibling-2a-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== table-sibling-2a-dyn.html table-sibling-2a-dyn.html +skip-if(B2G||Mulet) == table-sibling-2b-dyn.html table-sibling-2b-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== table-sibling-2b-dyn.html table-sibling-2b-dyn.html +skip-if(B2G||Mulet) == table-sibling-2c-dyn.html table-sibling-2c-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== table-sibling-2c-dyn.html table-sibling-2c-dyn.html +skip-if(B2G||Mulet) == table-sibling-3-dyn.html table-sibling-3-dyn.html +# bug 773482 +# Initial mulet triage: parity with B2G/B2G Desktop +== table-sibling-3-dyn.html table-sibling-3-dyn.html +# * table-caption boxes, per CSS 2.1 §9.4.1 (Block formatting contexts): +# "[...] block containers (such as [...] table-captions) [...] +# establish new block formatting contexts for their contents." +# The margins of a table-caption do not collapse with the margins +# of the table wrapper box. They can collapse with the margins of other +# table-captions, though, if they share the same caption-side. +== table-caption-1a.html table-caption-1a.html +== table-caption-1b.html table-caption-1b.html +== table-caption-1c.html table-caption-1c.html +== table-caption-2a.html table-caption-2a.html +== table-caption-2b.html table-caption-2b.html +== table-caption-2c.html table-caption-2c.html +== table-caption-1a-dyn.html table-caption-1a-dyn.html +== table-caption-1b-dyn.html table-caption-1b-dyn.html +== table-caption-1c-dyn.html table-caption-1c-dyn.html +== table-caption-2a-dyn.html table-caption-2a-dyn.html +== table-caption-2b-dyn.html table-caption-2b-dyn.html +== table-caption-2c-dyn.html table-caption-2c-dyn.html +# Note: CSS 2.1 suggests that the 'caption-side' values 'top-outside' and +# 'bottom-outside' will be used in a future CSS Module to restore the +# CSS 2 definition of 'top' and 'bottom' (which is different from CSS 2.1's). +# Since Bug #659828 was fixed, 'top-outside' and 'bottom-outside' act as an +# alias for the CSS 2.1 values 'top' and 'bottom' respectively. +== table-caption-top-1.html table-caption-top-1.html +== table-caption-top-2.html table-caption-top-2.html +== table-caption-top-outside-1.html table-caption-top-outside-1.html +== table-caption-top-outside-2.html table-caption-top-outside-2.html +skip == table-caption-bottom-1.html table-caption-bottom-1.html +== table-caption-bottom-2.html table-caption-bottom-2.html +== table-caption-bottom-outside-1.html table-caption-bottom-outside-1.html +== table-caption-bottom-outside-2.html table-caption-bottom-outside-2.html +== table-caption-top-1-dyn.html table-caption-top-1-dyn.html +== table-caption-top-2-dyn.html table-caption-top-2-dyn.html +== table-caption-top-outside-1-dyn.html table-caption-top-outside-1-dyn.html +== table-caption-top-outside-2-dyn.html table-caption-top-outside-2-dyn.html +== table-caption-bottom-1-dyn.html table-caption-bottom-1-dyn.html +== table-caption-bottom-2-dyn.html table-caption-bottom-2-dyn.html +== table-caption-bottom-outside-1-dyn.html table-caption-bottom-outside-1-dyn.html +== table-caption-bottom-outside-2-dyn.html table-caption-bottom-outside-2-dyn.html +== caption-sibling-1a.html caption-sibling-1a.html +# Bug 144517 +== caption-sibling-1a.html caption-sibling-1a.html +== caption-sibling-1b.html caption-sibling-1b.html +# Bug 144517 +== caption-sibling-1b.html caption-sibling-1b.html +== caption-sibling-1c.html caption-sibling-1c.html +# Bug 144517 +== caption-sibling-1c.html caption-sibling-1c.html +== caption-sibling-1a-dyn.html caption-sibling-1a-dyn.html +# Bug 144517 +== caption-sibling-1a-dyn.html caption-sibling-1a-dyn.html +skip == caption-sibling-1b-dyn.html caption-sibling-1b-dyn.html +# Bug 144517 +skip == caption-sibling-1b-dyn.html caption-sibling-1b-dyn.html +== caption-sibling-1c-dyn.html caption-sibling-1c-dyn.html +# Bug 144517 +== caption-sibling-1c-dyn.html caption-sibling-1c-dyn.html +== caption-sibling-2-dyn.html caption-sibling-2-dyn.html +# Bug 144517 +== caption-sibling-2-dyn.html caption-sibling-2-dyn.html +== caption-child-1.html caption-child-1.html +== caption-child-1-dyn.html caption-child-1-dyn.html +# * Multi-column elements, per CSS Multi-column Layout Module +# (Candidate Recommendation 12 April 2011): +# "A multi-column element establishes a new block formatting context [...]" +== column-sibling-1a.html column-sibling-1a.html +== column-sibling-1b.html column-sibling-1b.html +== column-sibling-1c.html column-sibling-1c.html +== column-sibling-1a-dyn.html column-sibling-1a-dyn.html +== column-sibling-1b-dyn.html column-sibling-1b-dyn.html +== column-sibling-1c-dyn.html column-sibling-1c-dyn.html +== column-sibling-2a.html column-sibling-2a.html +== column-sibling-2b.html column-sibling-2b.html +== column-sibling-2c.html column-sibling-2c.html +== column-sibling-2a-dyn.html column-sibling-2a-dyn.html +== column-sibling-2b-dyn.html column-sibling-2b-dyn.html +== column-sibling-2c-dyn.html column-sibling-2c-dyn.html +== column-child-1.html column-child-1.html +== column-child-1-dyn.html column-child-1-dyn.html +# * inline-block boxes +# "Margins of inline-block boxes do not collapse +# (not even with their in-flow children)." +== inline-block-sibling-1a.html inline-block-sibling-1a.html +== inline-block-sibling-1b.html inline-block-sibling-1b.html +== inline-block-sibling-1c.html inline-block-sibling-1c.html +== inline-block-sibling-2.html inline-block-sibling-2.html +== inline-block-sibling-2.html inline-block-sibling-2.html +== inline-block-sibling-1a-dyn.html inline-block-sibling-1a-dyn.html +== inline-block-sibling-1b-dyn.html inline-block-sibling-1b-dyn.html +== inline-block-sibling-1c-dyn.html inline-block-sibling-1c-dyn.html +== inline-block-sibling-2-dyn.html inline-block-sibling-2-dyn.html +== inline-block-child-1.html inline-block-child-1.html +== inline-block-child-2.html inline-block-child-2.html +== inline-block-child-2.html inline-block-child-2.html +== inline-block-child-3.html inline-block-child-3.html +== inline-block-child-1-dyn.html inline-block-child-1-dyn.html +== inline-block-child-2-dyn.html inline-block-child-2-dyn.html +== inline-block-child-3-dyn.html inline-block-child-3-dyn.html +# * absolutely positioned elements +# "Margins of absolutely positioned boxes do not collapse +# (not even with their in-flow children)." +== block-abs-pos-1.html block-abs-pos-1.html +== block-abs-pos-2.html block-abs-pos-2.html +== block-abs-pos-2.html block-abs-pos-2.html +== block-abs-pos-1-dyn.html block-abs-pos-1-dyn.html +== block-abs-pos-2-dyn.html block-abs-pos-2-dyn.html +# * Floats +# "Margins between a floated box and any other box do not collapse +# (not even between a float and its in-flow children)." +skip == block-float-1a.html block-float-1a.html +skip == block-float-1a.html block-float-1a.html +skip == block-float-1a.html block-float-1a.html +== block-float-1b.html block-float-1b.html +== block-float-1b.html block-float-1b.html +== block-float-1b.html block-float-1b.html +== block-float-2a.html block-float-2a.html +== block-float-2a.html block-float-2a.html +== block-float-2b.html block-float-2b.html +== block-float-2b.html block-float-2b.html +== block-float-3a.html block-float-3a.html +== block-float-3b.html block-float-3b.html +== block-float-1a-dyn.html block-float-1a-dyn.html +== block-float-1b-dyn.html block-float-1b-dyn.html +== block-float-2a-dyn.html block-float-2a-dyn.html +== block-float-2b-dyn.html block-float-2b-dyn.html +== block-float-3a-dyn.html block-float-3a-dyn.html +== block-float-3b-dyn.html block-float-3b-dyn.html +# Tests for various cases where clearance is applied and collapsing is +# prevented or only allows for certain margins. +== block-clear-1a.html block-clear-1a.html +== block-clear-1b.html block-clear-1b.html +== block-clear-2.html block-clear-2.html +== block-clear-2.html block-clear-2.html +== block-clear-3a.html block-clear-3a.html +== block-clear-3b.html block-clear-3b.html +== block-clear-3c.html block-clear-3c.html +== block-clear-3d.html block-clear-3d.html +== block-clear-3e.html block-clear-3e.html +== block-clear-3f.html block-clear-3f.html +skip == block-clear-4a.html block-clear-4a.html +== block-clear-4b.html block-clear-4b.html +== block-clear-4c.html block-clear-4c.html +== block-clear-4d.html block-clear-4d.html +== block-clear-4e.html block-clear-4e.html +== block-clear-4f.html block-clear-4f.html +== block-clear-5a.html block-clear-5a.html +== block-clear-5b.html block-clear-5b.html +== block-clear-5c.html block-clear-5c.html +== block-clear-5d.html block-clear-5d.html +== block-clear-5e.html block-clear-5e.html +== block-clear-5f.html block-clear-5f.html +== block-clear-5g.html block-clear-5g.html +== block-clear-5h.html block-clear-5h.html +== block-clear-6a-left.html block-clear-6a-left.html +# Bug 493380 +== block-clear-6b-left.html block-clear-6b-left.html +== block-clear-6c-left.html block-clear-6c-left.html +== block-clear-6d-left.html block-clear-6d-left.html +# Bug 493380 +== block-clear-6d-left.html block-clear-6d-left.html +# Bug 493380 +skip == block-clear-6e-left.html block-clear-6e-left.html +skip == block-clear-6e-left.html block-clear-6e-left.html +== block-clear-6f-left.html block-clear-6f-left.html +== block-clear-6f-left.html block-clear-6f-left.html +== block-clear-7a-left.html block-clear-7a-left.html +# Bug 493380 +== block-clear-7b-left.html block-clear-7b-left.html +# Bug 493380 +== block-clear-7c-left.html block-clear-7c-left.html +# Bug 493380 +== block-clear-7d-left.html block-clear-7d-left.html +== block-clear-7e-left.html block-clear-7e-left.html +# Bug 493380 +== block-clear-7e-left.html block-clear-7e-left.html +# Bug 493380 +== block-clear-7f-left.html block-clear-7f-left.html +# Bug 493380 +== block-clear-7f-left.html block-clear-7f-left.html +# Bug 493380 +== block-clear-7g-left.html block-clear-7g-left.html +# Bug 493380 +== block-clear-7g-left.html block-clear-7g-left.html +# Bug 493380 +== block-clear-7h-left.html block-clear-7h-left.html +== block-clear-7h-left.html block-clear-7h-left.html +# "Margins of the root element's box do not collapse." +# Testing the root margins of a generic XML document. +== block-xml-root-1.xml block-xml-root-1.xml +# In XML and XHTML, the html element is not necessarily the root element of +# a document. In that case, the margins of the html element collapse +# like the margins of any other block boxes. +skip == block-xhtml-root-1a.xhtml block-xhtml-root-1a.xhtml +skip == block-xhtml-root-1b.xhtml block-xhtml-root-1b.xhtml +skip == block-xhtml-root-2.xhtml block-xhtml-root-2.xhtml +skip == block-xhtml-root-3.xhtml block-xhtml-root-3.xhtml +# When the html element is the root element of the document, its margins +# do not collapse. +== block-xhtml-html-1a.xhtml block-xhtml-html-1a.xhtml +== block-xhtml-html-1b.xhtml block-xhtml-html-1b.xhtml +== block-xhtml-html-2.xhtml block-xhtml-html-2.xhtml +== block-xhtml-html-3.xhtml block-xhtml-html-3.xhtml +== block-xhtml-html-1a-dyn.xhtml block-xhtml-html-1a-dyn.xhtml +== block-xhtml-html-1b-dyn.xhtml block-xhtml-html-1b-dyn.xhtml +== block-xhtml-html-2-dyn.xhtml block-xhtml-html-2-dyn.xhtml +== block-xhtml-html-3-dyn.xhtml block-xhtml-html-3-dyn.xhtml +# In HTML documents only the html element can be the root element. +# Its margins do not collapse. +== block-html-html-1a.html block-html-html-1a.html +== block-html-html-1b.html block-html-html-1b.html +== block-html-html-2.html block-html-html-2.html +== block-html-html-3.html block-html-html-3.html +== block-html-html-1a-dyn.html block-html-html-1a-dyn.html +== block-html-html-1b-dyn.html block-html-html-1b-dyn.html +== block-html-html-2-dyn.html block-html-html-2-dyn.html +== block-html-html-3-dyn.html block-html-html-3-dyn.html +# These are older tests that check whether margins on the root element collapse. +== block-root-1a.html block-root-1a.html +== block-root-1a.html block-root-1a.html +== block-root-1a.html block-root-1a.html +== block-root-1a.html block-root-1a.html +== block-root-1b.html block-root-1b.html +== block-root-1b.html block-root-1b.html +== block-html-body-1.html block-html-body-1.html +== block-html-body-1.html block-html-body-1.html +== block-html-body-1.html block-html-body-1.html +# Some basic tests for margins given in percent and em. +== block-percent-1.html block-percent-1.html +== block-percent-1-dyn.html block-percent-1-dyn.html +== block-percent-2.html block-percent-2.html +== block-percent-2-dyn.html block-percent-2-dyn.html +== block-em-length-1.html block-em-length-1.html +== block-em-length-1-dyn.html block-em-length-1-dyn.html +# Other tests. +== dynamic-add-text-1.html dynamic-add-text-1.html +# Bug 467321 +== scrollable-vertical-margin.html scrollable-vertical-margin.html +== scrollable-horizontal-margin.html scrollable-horizontal-margin.html diff --git a/layout/reftests/margin-collapsing/reftest.list b/layout/reftests/margin-collapsing/reftest.list new file mode 100644 index 000000000..71e5de4e0 --- /dev/null +++ b/layout/reftests/margin-collapsing/reftest.list @@ -0,0 +1,864 @@ +# Test Suite for CSS 2.1, 8.3.1 Collapsing margins - See Bug 477462 +# Based on CSS 2.1: http://www.w3.org/TR/2011/REC-CSS2-20110607/ +# and its Errata, Last revised: $Date: 2013-09-09 17:40:16 $ +# The structure of this manifest is intended to resemble the structure of +# the prose that defines collapsing margins. As a result, there are several +# sections where inline-block-, block-, and other- series are combined. +# E.g. the first section is about horizontal margins and includes both +# inline- and block series. +# "Horizontal margins never collapse." +# Horizontal margins of inline boxes do not collapse. +# The norefs for these tests depict margins that incorrectly collapsed. +== inline-horizontal-1.html inline-horizontal-1-ref.html +!= inline-horizontal-1.html inline-horizontal-1-noref.html +== inline-horizontal-2.html inline-horizontal-2-ref.html +!= inline-horizontal-2.html inline-horizontal-2-noref.html +== inline-horizontal-1-dyn.html inline-horizontal-1-ref.html +!= inline-horizontal-1-dyn.html inline-horizontal-1-noref.html +== inline-horizontal-2-dyn.html inline-horizontal-2-ref.html +!= inline-horizontal-2-dyn.html inline-horizontal-2-noref.html +# Horizontal margins of block boxes do not collapse. +# These block boxes are actually floats - in CSS 2.1 there is no other +# method to create horizontally adjacent block boxes. +== block-horizontal-1.html block-horizontal-1-ref.html +!= block-horizontal-1.html block-horizontal-1-noref.html +== block-horizontal-2.html block-horizontal-2-ref.html +!= block-horizontal-2.html block-horizontal-2-noref.html +== block-horizontal-3.html block-horizontal-3-ref.html +!= block-horizontal-3.html block-horizontal-3-noref.html +== block-horizontal-4.html block-horizontal-4-ref.html +!= block-horizontal-4.html block-horizontal-4-noref.html +== block-horizontal-1-dyn.html block-horizontal-1-ref.html +!= block-horizontal-1-dyn.html block-horizontal-1-noref.html +== block-horizontal-2-dyn.html block-horizontal-2-ref.html +!= block-horizontal-2-dyn.html block-horizontal-2-noref.html +== block-horizontal-3-dyn.html block-horizontal-3-ref.html +!= block-horizontal-3-dyn.html block-horizontal-3-noref.html +== block-horizontal-4-dyn.html block-horizontal-4-ref.html +!= block-horizontal-4-dyn.html block-horizontal-4-noref.html +# Horizontal margins of inline-block boxes do not collapse. +== inline-block-horizontal-1.html inline-block-horizontal-1-ref.html +!= inline-block-horizontal-1.html inline-block-horizontal-1-noref.html +== inline-block-horizontal-2.html inline-block-horizontal-2-ref.html +!= inline-block-horizontal-2.html inline-block-horizontal-2-noref.html +== inline-block-horizontal-1-dyn.html inline-block-horizontal-1-ref.html +!= inline-block-horizontal-1-dyn.html inline-block-horizontal-1-noref.html +== inline-block-horizontal-2-dyn.html inline-block-horizontal-2-ref.html +!= inline-block-horizontal-2-dyn.html inline-block-horizontal-2-noref.html +# Horizontal margins of inline-tables do not collapse. +== inline-table-horizontal-1.html inline-table-horizontal-1-ref.html +!= inline-table-horizontal-1.html inline-table-horizontal-1-noref.html +== inline-table-horizontal-1-dyn.html inline-table-horizontal-1-ref.html +!= inline-table-horizontal-1-dyn.html inline-table-horizontal-1-noref.html +# "In CSS, the adjoining margins of two or more boxes +# (which might or might not be siblings) can combine to form a single margin. +# Margins that combine this way are said to collapse, +# and the resulting combined margin is called a collapsed margin." +# "Two margins are adjoining if and only if:" [...] +# "both belong to vertically-adjacent box edges, +# i.e. form one of the following pairs:" [...] +# "bottom margin of box and top margin of its next in-flow following sibling" +# "When two or more margins collapse, +# the resulting margin width is the maximum of the collapsing margins' widths." +# The margins of two in-flow siblings should collapse. +# These tests feature margins of different or equal sizes on each box. +# The norefs depict incorrect results where the margins did not collapse. +== block-sibling-1a.html block-sibling-1-ref.html +== block-sibling-1a.html block-sibling-1-ref2.html +!= block-sibling-1a.html block-sibling-1-noref.html +== block-sibling-1b.html block-sibling-1-ref.html +== block-sibling-1b.html block-sibling-1-ref2.html +!= block-sibling-1b.html block-sibling-1-noref.html +== block-sibling-1c.html block-sibling-1-ref.html +== block-sibling-1c.html block-sibling-1-ref2.html +!= block-sibling-1c.html block-sibling-1-noref2.html +== block-sibling-2.html block-sibling-2-ref.html +== block-sibling-2.html block-sibling-2-ref2.html +!= block-sibling-2.html block-sibling-2-noref.html +== block-sibling-3.html block-sibling-1-ref.html +== block-sibling-3.html block-sibling-1-ref2.html +!= block-sibling-3.html block-sibling-1-noref.html +== block-sibling-1a-dyn.html block-sibling-1-ref.html +== block-sibling-1a-dyn.html block-sibling-1-ref2.html +!= block-sibling-1a-dyn.html block-sibling-1-noref.html +== block-sibling-1b-dyn.html block-sibling-1-ref.html +== block-sibling-1b-dyn.html block-sibling-1-ref2.html +!= block-sibling-1b-dyn.html block-sibling-1-noref.html +== block-sibling-1c-dyn.html block-sibling-1-ref.html +== block-sibling-1c-dyn.html block-sibling-1-ref2.html +!= block-sibling-1c-dyn.html block-sibling-1-noref2.html +== block-sibling-2-dyn.html block-sibling-2-ref.html +== block-sibling-2-dyn.html block-sibling-2-ref2.html +!= block-sibling-2-dyn.html block-sibling-2-noref.html +== block-sibling-3-dyn.html block-sibling-1-ref.html +== block-sibling-3-dyn.html block-sibling-1-ref2.html +!= block-sibling-3-dyn.html block-sibling-1-noref.html +# "In the case of negative margins, the maximum of the absolute values of the +# negative adjoining margins is deducted from the maximum of the positive +# adjoining margins. If there are no positive margins, the maximum of the +# absolute values of the adjoining margins is deducted from zero." +# These tests feature sibling block boxes where one or two margins are negative. +# The norefs depict possible incorrect addition or subtraction of margins. +== block-negative-1a.html block-negative-1-ref.html +!= block-negative-1a.html block-negative-1-noref1.html +!= block-negative-1a.html block-negative-1-noref2.html +== block-negative-1b.html block-negative-1-ref.html +!= block-negative-1b.html block-negative-1-noref1.html +!= block-negative-1b.html block-negative-1-noref2.html +== block-negative-2a.html block-negative-2-ref.html +!= block-negative-2a.html block-negative-2-noref1.html +!= block-negative-2a.html block-negative-2-noref2.html +== block-negative-2b.html block-negative-2-ref.html +!= block-negative-2b.html block-negative-2-noref1.html +!= block-negative-2b.html block-negative-2-noref2.html +== block-negative-3a.html block-negative-3-ref.html +== block-negative-3a.html block-negative-3-ref2.html +!= block-negative-3a.html block-negative-3-noref1.html +!= block-negative-3a.html block-negative-3-noref2.html +== block-negative-3b.html block-negative-3-ref.html +== block-negative-3b.html block-negative-3-ref2.html +!= block-negative-3b.html block-negative-3-noref1.html +!= block-negative-3b.html block-negative-3-noref2.html +== block-negative-4a.html block-negative-4-ref.html +== block-negative-4a.html block-negative-4-ref2.html +!= block-negative-4a.html block-negative-4-noref1.html +!= block-negative-4a.html block-negative-4-noref2.html +== block-negative-4b.html block-negative-4-ref.html +== block-negative-4b.html block-negative-4-ref2.html +!= block-negative-4b.html block-negative-4-noref1.html +!= block-negative-4b.html block-negative-4-noref2.html +== block-negative-5.html block-negative-5-ref.html +== block-negative-5.html block-negative-5-ref2.html +!= block-negative-5.html block-negative-5-noref1.html +!= block-negative-5.html block-negative-5-noref2.html +== block-negative-1a-dyn1.html block-negative-1-ref.html +!= block-negative-1a-dyn1.html block-negative-1-noref1.html +!= block-negative-1a-dyn1.html block-negative-1-noref2.html +== block-negative-1a-dyn2.html block-negative-1-ref.html +!= block-negative-1a-dyn2.html block-negative-1-noref1.html +!= block-negative-1a-dyn2.html block-negative-1-noref2.html +== block-negative-1b-dyn1.html block-negative-1-ref.html +!= block-negative-1b-dyn1.html block-negative-1-noref1.html +!= block-negative-1b-dyn1.html block-negative-1-noref2.html +== block-negative-1b-dyn2.html block-negative-1-ref.html +!= block-negative-1b-dyn2.html block-negative-1-noref1.html +!= block-negative-1b-dyn2.html block-negative-1-noref2.html +== block-negative-2a-dyn1.html block-negative-2-ref.html +!= block-negative-2a-dyn1.html block-negative-2-noref1.html +!= block-negative-2a-dyn1.html block-negative-2-noref2.html +== block-negative-2a-dyn2.html block-negative-2-ref.html +!= block-negative-2a-dyn2.html block-negative-2-noref1.html +!= block-negative-2a-dyn2.html block-negative-2-noref2.html +== block-negative-2b-dyn1.html block-negative-2-ref.html +!= block-negative-2b-dyn1.html block-negative-2-noref1.html +!= block-negative-2b-dyn1.html block-negative-2-noref2.html +== block-negative-2b-dyn2.html block-negative-2-ref.html +!= block-negative-2b-dyn2.html block-negative-2-noref1.html +!= block-negative-2b-dyn2.html block-negative-2-noref2.html +== block-negative-3a-dyn1.html block-negative-3-ref.html +== block-negative-3a-dyn1.html block-negative-3-ref2.html +!= block-negative-3a-dyn1.html block-negative-3-noref1.html +!= block-negative-3a-dyn1.html block-negative-3-noref2.html +== block-negative-3a-dyn2.html block-negative-3-ref.html +== block-negative-3a-dyn2.html block-negative-3-ref2.html +!= block-negative-3a-dyn2.html block-negative-3-noref1.html +!= block-negative-3a-dyn2.html block-negative-3-noref2.html +== block-negative-3b-dyn1.html block-negative-3-ref.html +== block-negative-3b-dyn1.html block-negative-3-ref2.html +!= block-negative-3b-dyn1.html block-negative-3-noref1.html +!= block-negative-3b-dyn1.html block-negative-3-noref2.html +== block-negative-3b-dyn2.html block-negative-3-ref.html +== block-negative-3b-dyn2.html block-negative-3-ref2.html +!= block-negative-3b-dyn2.html block-negative-3-noref1.html +!= block-negative-3b-dyn2.html block-negative-3-noref2.html +== block-negative-4a-dyn1.html block-negative-4-ref.html +== block-negative-4a-dyn1.html block-negative-4-ref2.html +!= block-negative-4a-dyn1.html block-negative-4-noref1.html +!= block-negative-4a-dyn1.html block-negative-4-noref2.html +== block-negative-4a-dyn2.html block-negative-4-ref.html +== block-negative-4a-dyn2.html block-negative-4-ref2.html +!= block-negative-4a-dyn2.html block-negative-4-noref1.html +!= block-negative-4a-dyn2.html block-negative-4-noref2.html +== block-negative-4b-dyn1.html block-negative-4-ref.html +== block-negative-4b-dyn1.html block-negative-4-ref2.html +!= block-negative-4b-dyn1.html block-negative-4-noref1.html +!= block-negative-4b-dyn1.html block-negative-4-noref2.html +== block-negative-4b-dyn2.html block-negative-4-ref.html +== block-negative-4b-dyn2.html block-negative-4-ref2.html +!= block-negative-4b-dyn2.html block-negative-4-noref1.html +!= block-negative-4b-dyn2.html block-negative-4-noref2.html +== block-negative-5-dyn1.html block-negative-5-ref.html +== block-negative-5-dyn1.html block-negative-5-ref2.html +!= block-negative-5-dyn1.html block-negative-5-noref1.html +!= block-negative-5-dyn1.html block-negative-5-noref2.html +== block-negative-5-dyn2.html block-negative-5-ref.html +== block-negative-5-dyn2.html block-negative-5-ref2.html +!= block-negative-5-dyn2.html block-negative-5-noref1.html +!= block-negative-5-dyn2.html block-negative-5-noref2.html +# "Two margins are adjoining if and only if:" [...] +# "both belong to vertically-adjacent box edges, +# i.e. form one of the following pairs:" [...] +# "top margin of a box and top margin of its first in-flow child" +# "bottom margin of a last in-flow child and bottom margin of its parent +# if the parent has 'auto' computed height" +# "A collapsed margin is considered adjoining to another margin if +# any of its component margins is adjoining to that margin." +# "Note. Adjoining margins can be generated by elements that are +# not related as siblings or ancestors." +# These tests check whether margins are correctly collapsed even when the +# boxes participating are not related as siblings or ancestors. +# The tests feature different sizes of margins on different boxes. +== block-non-sibling-1a.html block-non-sibling-1-ref.html +== block-non-sibling-1a.html block-non-sibling-1-ref2.html +== block-non-sibling-1b.html block-non-sibling-1-ref.html +== block-non-sibling-1b.html block-non-sibling-1-ref2.html +== block-non-sibling-1c.html block-non-sibling-1-ref.html +== block-non-sibling-1c.html block-non-sibling-1-ref2.html +== block-non-sibling-1d.html block-non-sibling-1-ref.html +== block-non-sibling-1d.html block-non-sibling-1-ref2.html +== block-non-sibling-1e.html block-non-sibling-1-ref.html +== block-non-sibling-1e.html block-non-sibling-1-ref2.html +== block-non-sibling-1f.html block-non-sibling-1-ref.html +== block-non-sibling-1f.html block-non-sibling-1-ref2.html +== block-non-sibling-2a.html block-non-sibling-2-ref.html +== block-non-sibling-2a.html block-non-sibling-2-ref2.html +== block-non-sibling-2b.html block-non-sibling-2-ref.html +== block-non-sibling-2b.html block-non-sibling-2-ref2.html +== block-non-sibling-2c.html block-non-sibling-2-ref.html +== block-non-sibling-2c.html block-non-sibling-2-ref2.html +== block-non-sibling-2d.html block-non-sibling-2-ref.html +== block-non-sibling-2d.html block-non-sibling-2-ref2.html +== block-non-sibling-2e.html block-non-sibling-2-ref.html +== block-non-sibling-2e.html block-non-sibling-2-ref2.html +== block-non-sibling-2f.html block-non-sibling-2-ref.html +== block-non-sibling-2f.html block-non-sibling-2-ref2.html +== block-non-sibling-3a.html block-non-sibling-3-ref.html +== block-non-sibling-3a.html block-non-sibling-3-ref2.html +== block-non-sibling-3b.html block-non-sibling-3-ref.html +== block-non-sibling-3b.html block-non-sibling-3-ref2.html +== block-non-sibling-3c.html block-non-sibling-3-ref.html +== block-non-sibling-3c.html block-non-sibling-3-ref2.html +== block-non-sibling-3d.html block-non-sibling-3-ref.html +== block-non-sibling-3d.html block-non-sibling-3-ref2.html +== block-non-sibling-4.html block-non-sibling-4-ref.html +== block-non-sibling-4.html block-non-sibling-4-ref2.html +== block-non-sibling-1a-dyn.html block-non-sibling-1-ref2.html +== block-non-sibling-1b-dyn.html block-non-sibling-1-ref2.html +== block-non-sibling-1c-dyn.html block-non-sibling-1-ref2.html +== block-non-sibling-1d-dyn.html block-non-sibling-1-ref2.html +== block-non-sibling-1e-dyn.html block-non-sibling-1-ref2.html +== block-non-sibling-1f-dyn.html block-non-sibling-1-ref2.html +== block-non-sibling-2a-dyn.html block-non-sibling-2-ref2.html +== block-non-sibling-2b-dyn.html block-non-sibling-2-ref2.html +== block-non-sibling-2c-dyn.html block-non-sibling-2-ref2.html +== block-non-sibling-2d-dyn.html block-non-sibling-2-ref2.html +== block-non-sibling-2e-dyn.html block-non-sibling-2-ref2.html +== block-non-sibling-2f-dyn.html block-non-sibling-2-ref2.html +== block-non-sibling-3a-dyn.html block-non-sibling-3-ref2.html +== block-non-sibling-3b-dyn.html block-non-sibling-3-ref2.html +== block-non-sibling-3c-dyn.html block-non-sibling-3-ref2.html +== block-non-sibling-3d-dyn.html block-non-sibling-3-ref2.html +== block-non-sibling-4-dyn.html block-non-sibling-4-ref2.html +# The first-child series tests cases where the top margin of a box collapses +# with the top margin of its parent element. +# This series is more extensive than the non-sibling series, because +# various combinations of positive and negative margins are tested. +== block-first-child-1a.html block-first-child-1-ref.html +== block-first-child-1b.html block-first-child-1-ref.html +== block-first-child-1c.html block-first-child-1-ref.html +== block-first-child-2.html block-first-child-2-ref.html +== block-first-child-3.html block-first-child-3-ref.html +== block-first-child-4.html block-first-child-4-ref.html +== block-first-child-5.html block-first-child-5-ref.html +== block-first-child-6.html block-first-child-6-ref.html +== block-first-child-7.html block-first-child-7-ref.html +== block-first-child-8a.html block-first-child-8-ref.html +== block-first-child-8b.html block-first-child-8-ref.html +== block-first-child-8c.html block-first-child-8-ref.html +== block-first-child-1a-dyn.html block-first-child-1-ref.html +== block-first-child-1b-dyn.html block-first-child-1-ref.html +== block-first-child-1c-dyn.html block-first-child-1-ref.html +== block-first-child-2-dyn.html block-first-child-2-ref.html +== block-first-child-3-dyn.html block-first-child-3-ref.html +== block-first-child-4-dyn.html block-first-child-4-ref.html +== block-first-child-5-dyn.html block-first-child-5-ref.html +== block-first-child-6-dyn.html block-first-child-6-ref.html +== block-first-child-7-dyn.html block-first-child-7-ref.html +== block-first-child-8a-dyn.html block-first-child-8-ref.html +== block-first-child-8b-dyn.html block-first-child-8-ref.html +== block-first-child-8c-dyn.html block-first-child-8-ref.html +# "The bottom margin of an in-flow block box with a 'height' of 'auto' +# collapses with its last in-flow block-level child's bottom margin" +# Note: The block-auto-height-last-child series automatically covers +# all cases where 'min-height' is '0' and 'max-height' is 'none' as +# these are the default values of those properties. +== block-auto-height-last-child-1a.html block-auto-height-last-child-1-ref.html +== block-auto-height-last-child-1b.html block-auto-height-last-child-1-ref.html +== block-auto-height-last-child-1c.html block-auto-height-last-child-1-ref.html +== block-auto-height-last-child-2.html block-auto-height-last-child-2-ref.html +== block-auto-height-last-child-3.html block-auto-height-last-child-3-ref.html +== block-auto-height-last-child-4.html block-auto-height-last-child-4-ref.html +== block-auto-height-last-child-5.html block-auto-height-last-child-5-ref.html +== block-auto-height-last-child-6.html block-auto-height-last-child-6-ref.html +== block-auto-height-last-child-7.html block-auto-height-last-child-7-ref.html +== block-auto-height-last-child-8a.html block-auto-height-last-child-8-ref.html +== block-auto-height-last-child-8b.html block-auto-height-last-child-8-ref.html +== block-auto-height-last-child-8c.html block-auto-height-last-child-8-ref.html +== block-auto-height-last-child-1a-dyn.html block-auto-height-last-child-1-ref.html +== block-auto-height-last-child-1b-dyn.html block-auto-height-last-child-1-ref.html +== block-auto-height-last-child-1c-dyn.html block-auto-height-last-child-1-ref.html +== block-auto-height-last-child-2-dyn.html block-auto-height-last-child-2-ref.html +== block-auto-height-last-child-3-dyn.html block-auto-height-last-child-3-ref.html +== block-auto-height-last-child-4-dyn.html block-auto-height-last-child-4-ref.html +== block-auto-height-last-child-5-dyn.html block-auto-height-last-child-5-ref.html +== block-auto-height-last-child-6-dyn.html block-auto-height-last-child-6-ref.html +== block-auto-height-last-child-7-dyn.html block-auto-height-last-child-7-ref.html +== block-auto-height-last-child-8a-dyn.html block-auto-height-last-child-8-ref.html +== block-auto-height-last-child-8b-dyn.html block-auto-height-last-child-8-ref.html +== block-auto-height-last-child-8c-dyn.html block-auto-height-last-child-8-ref.html +# The last-child series is an older variant of the +# block-auto-height-last-child tests. +== block-last-child-1a.html block-last-child-1-ref.html +== block-last-child-1b.html block-last-child-1-ref.html +== block-last-child-1c.html block-last-child-1-ref.html +== block-last-child-2a.html block-last-child-2-ref.html +== block-last-child-2b.html block-last-child-2-ref.html +== block-last-child-2c.html block-last-child-2-ref.html +== block-last-child-2d.html block-last-child-2-ref.html +== block-last-child-3a.html block-last-child-3-ref.html +== block-last-child-3b.html block-last-child-3-ref.html +== block-last-child-3c.html block-last-child-3-ref.html +== block-last-child-3d.html block-last-child-3-ref.html +== block-last-child-4a.html block-last-child-4-ref.html +== block-last-child-4b.html block-last-child-4-ref.html +== block-last-child-4c.html block-last-child-4-ref.html +== block-last-child-4d.html block-last-child-4-ref.html +# There's also the older block-zero-min-height series which explicitly +# adds min-height: 0; to boxes with height: auto; +# This should have no effect on margin-collapsing. +== block-zero-min-height-1a.html block-zero-min-height-1-ref.html +== block-zero-min-height-1b.html block-zero-min-height-1-ref.html +== block-zero-min-height-1c.html block-zero-min-height-1-ref.html +== block-zero-min-height-1d.html block-zero-min-height-1-ref.html +== block-zero-min-height-1e.html block-zero-min-height-1-ref.html +== block-zero-min-height-1f.html block-zero-min-height-1-ref.html +!= block-zero-min-height-1a.html block-zero-min-height-1-noref.html +!= block-zero-min-height-1b.html block-zero-min-height-1-noref.html +!= block-zero-min-height-1c.html block-zero-min-height-1-noref.html +!= block-zero-min-height-1d.html block-zero-min-height-1-noref.html +!= block-zero-min-height-1e.html block-zero-min-height-1-noref.html +!= block-zero-min-height-1f.html block-zero-min-height-1-noref.html +== block-zero-min-height-2a.html block-zero-min-height-2ab-ref.html +== block-zero-min-height-2b.html block-zero-min-height-2ab-ref.html +== block-zero-min-height-2c.html block-zero-min-height-2c-ref.html +== block-zero-min-height-2d.html block-zero-min-height-2de-ref.html +== block-zero-min-height-2e.html block-zero-min-height-2de-ref.html +== block-zero-min-height-2f.html block-zero-min-height-2f-ref.html +!= block-zero-min-height-2a.html block-zero-min-height-2-noref.html +!= block-zero-min-height-2b.html block-zero-min-height-2-noref.html +!= block-zero-min-height-2c.html block-zero-min-height-2-noref.html +!= block-zero-min-height-2d.html block-zero-min-height-2-noref.html +!= block-zero-min-height-2e.html block-zero-min-height-2-noref.html +!= block-zero-min-height-2f.html block-zero-min-height-2-noref.html +== block-zero-min-height-3a.html block-zero-min-height-3-ref.html +== block-zero-min-height-3b.html block-zero-min-height-3-ref.html +== block-zero-min-height-3c.html block-zero-min-height-3-ref.html +== block-zero-min-height-3d.html block-zero-min-height-3-ref.html +# If a parent box's height is 'auto' and its 'min-height' is non-zero, +# then its bottom margin collapses with its last-child's bottom margin. +# This is true even if the two margins do not actually touch each other, +# as they are still considered 'adjoining'. +fails == block-min-height-last-child-1a.html block-min-height-last-child-1-ref.html # Bug 616339 +== block-min-height-last-child-1b.html block-min-height-last-child-1-ref.html +== block-min-height-last-child-1c.html block-min-height-last-child-1-ref.html +fails == block-min-height-last-child-2a.html block-min-height-last-child-2-ref.html # Bug 616339 +fails == block-min-height-last-child-2b.html block-min-height-last-child-2-ref.html # Bug 616339 +fails == block-min-height-last-child-3a.html block-min-height-last-child-3-ref.html # Bug 616339 +== block-min-height-last-child-3b.html block-min-height-last-child-3-ref.html +== block-min-height-last-child-3c.html block-min-height-last-child-3-ref.html +== block-min-height-last-child-4a.html block-min-height-last-child-4-ref.html +== block-min-height-last-child-4b.html block-min-height-last-child-4-ref.html +== block-min-height-last-child-4c.html block-min-height-last-child-4-ref.html +== block-min-height-last-child-5a.html block-min-height-last-child-5-ref.html +== block-min-height-last-child-5b.html block-min-height-last-child-5-ref.html +== block-min-height-last-child-6a.html block-min-height-last-child-6-ref.html +== block-min-height-last-child-6b.html block-min-height-last-child-6-ref.html +== block-min-height-last-child-6c.html block-min-height-last-child-6-ref.html +== block-min-height-last-child-7a.html block-min-height-last-child-7-ref.html +== block-min-height-last-child-7b.html block-min-height-last-child-7-ref.html +== block-min-height-last-child-7c.html block-min-height-last-child-7-ref.html +== block-min-height-last-child-8a.html block-min-height-last-child-8-ref.html +== block-min-height-last-child-8b.html block-min-height-last-child-8-ref.html +== block-min-height-last-child-9a.html block-min-height-last-child-9-ref.html +== block-min-height-last-child-9b.html block-min-height-last-child-9-ref.html +== block-min-height-last-child-9c.html block-min-height-last-child-9-ref.html +fails == block-min-height-last-child-1a-dyn.html block-min-height-last-child-1-ref.html # Bug 616339 +== block-min-height-last-child-1b-dyn.html block-min-height-last-child-1-ref.html +== block-min-height-last-child-1c-dyn.html block-min-height-last-child-1-ref.html +fails == block-min-height-last-child-2a-dyn.html block-min-height-last-child-2-ref.html # Bug 616339 +fails == block-min-height-last-child-2b-dyn.html block-min-height-last-child-2-ref.html # Bug 616339 +fails == block-min-height-last-child-3a-dyn.html block-min-height-last-child-3-ref.html # Bug 616339 +== block-min-height-last-child-3b-dyn.html block-min-height-last-child-3-ref.html +== block-min-height-last-child-3c-dyn.html block-min-height-last-child-3-ref.html +== block-min-height-last-child-4a-dyn.html block-min-height-last-child-4-ref.html +== block-min-height-last-child-4b-dyn.html block-min-height-last-child-4-ref.html +== block-min-height-last-child-4c-dyn.html block-min-height-last-child-4-ref.html +== block-min-height-last-child-5a-dyn.html block-min-height-last-child-5-ref.html +== block-min-height-last-child-5b-dyn.html block-min-height-last-child-5-ref.html +== block-min-height-last-child-6a-dyn.html block-min-height-last-child-6-ref.html +== block-min-height-last-child-6b-dyn.html block-min-height-last-child-6-ref.html +== block-min-height-last-child-6c-dyn.html block-min-height-last-child-6-ref.html +== block-min-height-last-child-7a-dyn.html block-min-height-last-child-7-ref.html +== block-min-height-last-child-7b-dyn.html block-min-height-last-child-7-ref.html +== block-min-height-last-child-7c-dyn.html block-min-height-last-child-7-ref.html +== block-min-height-last-child-8a-dyn.html block-min-height-last-child-8-ref.html +== block-min-height-last-child-8b-dyn.html block-min-height-last-child-8-ref.html +== block-min-height-last-child-9a-dyn.html block-min-height-last-child-9-ref.html +== block-min-height-last-child-9b-dyn.html block-min-height-last-child-9-ref.html +== block-min-height-last-child-9c-dyn.html block-min-height-last-child-9-ref.html +# If a parent box's height is 'auto' and its 'max-height' is not 'none' +# then its bottom margin collapses with its last-child's bottom margin. +# According to CSS 2.1 §10.7 (Minimum and maximum heights) this is true, +# even if the descendant's height is bigger than the defined max-height. +== block-max-height-last-child-1a.html block-max-height-last-child-1-ref.html +== block-max-height-last-child-1b.html block-max-height-last-child-1-ref.html +== block-max-height-last-child-1c.html block-max-height-last-child-1-ref.html +== block-max-height-last-child-2a.html block-max-height-last-child-2-ref.html +== block-max-height-last-child-2b.html block-max-height-last-child-2-ref.html +== block-max-height-last-child-3a.html block-max-height-last-child-3-ref.html +== block-max-height-last-child-3b.html block-max-height-last-child-3-ref.html +== block-max-height-last-child-3c.html block-max-height-last-child-3-ref.html +== block-max-height-last-child-4a.html block-max-height-last-child-4-ref.html +== block-max-height-last-child-4b.html block-max-height-last-child-4-ref.html +== block-max-height-last-child-4c.html block-max-height-last-child-4-ref.html +== block-max-height-last-child-5a.html block-max-height-last-child-5-ref.html +== block-max-height-last-child-5b.html block-max-height-last-child-5-ref.html +== block-max-height-last-child-6a.html block-max-height-last-child-6-ref.html +== block-max-height-last-child-6b.html block-max-height-last-child-6-ref.html +== block-max-height-last-child-6c.html block-max-height-last-child-6-ref.html +fails == block-max-height-last-child-7a.html block-max-height-last-child-7-ref.html # Bug 616339 +== block-max-height-last-child-7b.html block-max-height-last-child-7-ref.html +== block-max-height-last-child-7c.html block-max-height-last-child-7-ref.html +fails == block-max-height-last-child-8a.html block-max-height-last-child-8-ref.html # Bug 616339 +fails == block-max-height-last-child-8b.html block-max-height-last-child-8-ref.html # Bug 616339 +fails == block-max-height-last-child-9a.html block-max-height-last-child-9-ref.html # Bug 616339 +== block-max-height-last-child-9b.html block-max-height-last-child-9-ref.html +== block-max-height-last-child-9c.html block-max-height-last-child-9-ref.html +== block-max-height-last-child-1a-dyn.html block-max-height-last-child-1-ref.html +== block-max-height-last-child-1b-dyn.html block-max-height-last-child-1-ref.html +== block-max-height-last-child-1c-dyn.html block-max-height-last-child-1-ref.html +== block-max-height-last-child-2a-dyn.html block-max-height-last-child-2-ref.html +== block-max-height-last-child-2b-dyn.html block-max-height-last-child-2-ref.html +== block-max-height-last-child-3a-dyn.html block-max-height-last-child-3-ref.html +== block-max-height-last-child-3b-dyn.html block-max-height-last-child-3-ref.html +== block-max-height-last-child-3c-dyn.html block-max-height-last-child-3-ref.html +== block-max-height-last-child-4a-dyn.html block-max-height-last-child-4-ref.html +== block-max-height-last-child-4b-dyn.html block-max-height-last-child-4-ref.html +== block-max-height-last-child-4c-dyn.html block-max-height-last-child-4-ref.html +== block-max-height-last-child-5a-dyn.html block-max-height-last-child-5-ref.html +== block-max-height-last-child-5b-dyn.html block-max-height-last-child-5-ref.html +== block-max-height-last-child-6a-dyn.html block-max-height-last-child-6-ref.html +== block-max-height-last-child-6b-dyn.html block-max-height-last-child-6-ref.html +== block-max-height-last-child-6c-dyn.html block-max-height-last-child-6-ref.html +fails == block-max-height-last-child-7a-dyn.html block-max-height-last-child-7-ref.html # Bug 616339 +== block-max-height-last-child-7b-dyn.html block-max-height-last-child-7-ref.html +== block-max-height-last-child-7c-dyn.html block-max-height-last-child-7-ref.html +fails == block-max-height-last-child-8a-dyn.html block-max-height-last-child-8-ref.html # Bug 616339 +fails == block-max-height-last-child-8b-dyn.html block-max-height-last-child-8-ref.html # Bug 616339 +fails == block-max-height-last-child-9a-dyn.html block-max-height-last-child-9-ref.html # Bug 616339 +== block-max-height-last-child-9b-dyn.html block-max-height-last-child-9-ref.html +== block-max-height-last-child-9c-dyn.html block-max-height-last-child-9-ref.html +# If a parent box's height is not 'auto' then its bottom margin +# never collapses with its last-child's bottom margin, +# as these margins are not considered 'adjoining'. +# According to CSS 2.1 §10.7 (Minimum and maximum heights) this is true, +# even if the value of min- or max-height is used instead. +== block-fix-height-last-child-1a.html block-fix-height-last-child-1-ref.html +== block-fix-height-last-child-1b.html block-fix-height-last-child-1-ref.html +== block-fix-height-last-child-2a.html block-fix-height-last-child-2-ref.html +== block-fix-height-last-child-2b.html block-fix-height-last-child-2-ref.html +== block-fix-height-last-child-3a.html block-fix-height-last-child-3-ref.html +== block-fix-height-last-child-3b.html block-fix-height-last-child-3-ref.html +== block-fix-height-last-child-4a.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4b.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4c.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4d.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4e.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4f.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4g.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4h.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-1a-dyn.html block-fix-height-last-child-1-ref.html +== block-fix-height-last-child-1b-dyn.html block-fix-height-last-child-1-ref.html +== block-fix-height-last-child-2a-dyn.html block-fix-height-last-child-2-ref.html +== block-fix-height-last-child-2b-dyn.html block-fix-height-last-child-2-ref.html +== block-fix-height-last-child-3a-dyn.html block-fix-height-last-child-3-ref.html +== block-fix-height-last-child-3b-dyn.html block-fix-height-last-child-3-ref.html +== block-fix-height-last-child-4a-dyn.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4b-dyn.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4c-dyn.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4d-dyn.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4e-dyn.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4f-dyn.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4g-dyn.html block-fix-height-last-child-4-ref.html +== block-fix-height-last-child-4h-dyn.html block-fix-height-last-child-4-ref.html +# "Two margins are adjoining if and only if:" [...] +# "both belong to vertically-adjacent box edges, +# i.e. form one of the following pairs:" [...] +# "top and bottom margins of a box that does not establish a new block +# formatting context and that has zero computed 'min-height', zero or +# 'auto' computed 'height', and no in-flow children" +# Note that "if the top and bottom margins of a box are adjoining, then it is +# possible for margins to collapse through it." +# I.e. a parent's top and bottom margin are still considered adjoining if +# they collapse through their in-flow children's margins. +== block-no-content-1a.html block-no-content-1-ref.html +== block-no-content-1b.html block-no-content-1-ref.html +== block-no-content-1c.html block-no-content-1-ref.html +== block-no-content-1d.html block-no-content-1-ref.html +== block-no-content-2a.html block-no-content-2-ref.html +== block-no-content-2b.html block-no-content-2-ref.html +== block-no-content-2c.html block-no-content-2-ref.html +== block-no-content-2d.html block-no-content-2-ref.html +== block-no-content-2e.html block-no-content-2-ref.html +== block-no-content-3a.html block-no-content-3-ref.html +== block-no-content-3b.html block-no-content-3-ref.html +== block-no-content-3c.html block-no-content-3-ref.html +== block-no-content-4a.html block-no-content-4-ref.html +== block-no-content-4b.html block-no-content-4-ref.html +== block-no-content-4c.html block-no-content-4-ref.html +== block-no-content-5a.html block-no-content-5-ref.html +== block-no-content-5b.html block-no-content-5-ref.html +== block-no-content-6.html block-no-content-6-ref.html +== block-no-content-7.html block-no-content-7-ref.html +# "If the top margin of a box with non-zero computed 'min-height' and 'auto' +# computed 'height' collapses with the bottom margin of its last in-flow +# child, then the child's bottom margin does not collapse with the parent's +# bottom margin." +== block-no-content-8.html block-no-content-8-ref.html +== block-no-content-1a-dyn.html block-no-content-1-ref.html +== block-no-content-1b-dyn.html block-no-content-1-ref.html +== block-no-content-1c-dyn.html block-no-content-1-ref.html +== block-no-content-1d-dyn.html block-no-content-1-ref.html +== block-no-content-2a-dyn.html block-no-content-2-ref.html +== block-no-content-2b-dyn.html block-no-content-2-ref.html +== block-no-content-2c-dyn.html block-no-content-2-ref.html +== block-no-content-2d-dyn.html block-no-content-2-ref.html +== block-no-content-2e-dyn.html block-no-content-2-ref.html +== block-no-content-3a-dyn.html block-no-content-3-ref.html +== block-no-content-3b-dyn.html block-no-content-3-ref.html +== block-no-content-3c-dyn.html block-no-content-3-ref.html +== block-no-content-4a-dyn.html block-no-content-4-ref.html +== block-no-content-4b-dyn.html block-no-content-4-ref.html +== block-no-content-4c-dyn.html block-no-content-4-ref.html +== block-no-content-5a-dyn.html block-no-content-5-ref.html +== block-no-content-5b-dyn.html block-no-content-5-ref.html +== block-no-content-6-dyn.html block-no-content-6-ref.html +== block-no-content-7-dyn.html block-no-content-7-ref.html +== block-no-content-8-dyn.html block-no-content-8-ref.html +# These tests are similar to the no-content ones, except that some boxes +# have height: 0; declared on them. +== block-zero-height-1a.html block-zero-height-1a-ref.html +== block-zero-height-1b.html block-zero-height-1b-ref.html +== block-zero-height-2a.html block-zero-height-2a-ref.html +== block-zero-height-2b.html block-zero-height-2b-ref.html +== block-zero-height-2c.html block-zero-height-2c-ref.html +== block-zero-height-3a.html block-zero-height-3-ref.html +== block-zero-height-3b.html block-zero-height-3-ref.html +== block-zero-height-3c.html block-zero-height-3-ref.html +# "Margins of elements that establish new block formatting contexts ([...]) +# do not collapse with their in-flow children." +# The margins of a block formatting context can collapse with margins of +# in-flow sibling boxes, but not with margins of their in-flow children. +# Elements that establish a block formatting context are: +# * "elements with 'overflow' other than 'visible'" +== block-overflow-1.html block-overflow-1-ref.html +== block-overflow-1.html block-overflow-1-ref2.html +== block-overflow-2.html block-overflow-2-ref.html +== block-overflow-2.html block-overflow-2-ref2.html +== block-overflow-3.html block-overflow-3-ref.html +== block-overflow-3.html block-overflow-3-ref2.html +== block-overflow-4.html block-overflow-4-ref.html +== block-overflow-4.html block-overflow-4-ref2.html +== block-overflow-5a.html block-overflow-5-ref.html +== block-overflow-5a.html block-overflow-5-ref2.html +== block-overflow-5b.html block-overflow-5-ref.html +== block-overflow-5b.html block-overflow-5-ref2.html +== block-overflow-5c.html block-overflow-5c-ref.html +== block-overflow-5c.html block-overflow-5c-ref2.html +== block-overflow-5d.html block-overflow-5-ref.html +== block-overflow-5d.html block-overflow-5-ref2.html +== block-overflow-1-dyn.html block-overflow-1-ref2.html +== block-overflow-2-dyn.html block-overflow-2-ref2.html +== block-overflow-3-dyn.html block-overflow-3-ref2.html +== block-overflow-4-dyn.html block-overflow-4-ref2.html +== block-overflow-5a-dyn.html block-overflow-5-ref2.html +== block-overflow-5b-dyn.html block-overflow-5-ref2.html +== block-overflow-5c-dyn.html block-overflow-5c-ref2.html +== block-overflow-5d-dyn.html block-overflow-5-ref2.html +# * 'fieldset' elements, per HTML5 (Candidate Recommendation 6 August 2013): +# §10.3.13 (The fieldset and legend elements): "The fieldset element is +# expected to establish a new block formatting context." +== fieldset-sibling-1a.html fieldset-sibling-1-ref.html +== fieldset-sibling-1b.html fieldset-sibling-1-ref.html +== fieldset-sibling-1c.html fieldset-sibling-1-ref.html +== fieldset-sibling-2a.html fieldset-sibling-2-ref1.html +== fieldset-sibling-2b.html fieldset-sibling-2-ref1.html +== fieldset-sibling-2c.html fieldset-sibling-2-ref1.html +== fieldset-sibling-2a.html fieldset-sibling-2-ref2.html +== fieldset-sibling-2b.html fieldset-sibling-2-ref2.html +== fieldset-sibling-2c.html fieldset-sibling-2-ref2.html +== fieldset-sibling-1a-dyn.html fieldset-sibling-1-ref.html +== fieldset-sibling-1b-dyn.html fieldset-sibling-1-ref.html +== fieldset-sibling-1c-dyn.html fieldset-sibling-1-ref.html +== fieldset-sibling-2a-dyn.html fieldset-sibling-2-ref2.html +== fieldset-sibling-2b-dyn.html fieldset-sibling-2-ref2.html +== fieldset-sibling-2c-dyn.html fieldset-sibling-2-ref2.html +== fieldset-child-1.html fieldset-child-1-ref.html +== fieldset-child-1-dyn.html fieldset-child-1-ref.html +# * Tables, per CSS 2.1 §17.4 (Tables in the visual formatting model): +# "The table wrapper box establishes a block formatting context." +# "The table wrapper box is a 'block' box if the table is block-level [...]" +== table-sibling-1a.html table-sibling-1-ref.html +!= table-sibling-1a.html table-sibling-1-noref.html +== table-sibling-1b.html table-sibling-1-ref.html +!= table-sibling-1b.html table-sibling-1-noref.html +== table-sibling-1c.html table-sibling-1-ref.html +!= table-sibling-1c.html table-sibling-1-noref2.html +== table-sibling-2a.html table-sibling-2-ref.html +!= table-sibling-2a.html table-sibling-2-noref.html +== table-sibling-2b.html table-sibling-2-ref.html +!= table-sibling-2b.html table-sibling-2-noref.html +== table-sibling-2c.html table-sibling-2-ref.html +!= table-sibling-2c.html table-sibling-2-noref2.html +== table-sibling-1a-dyn.html table-sibling-1-ref.html +!= table-sibling-1a-dyn.html table-sibling-1-noref.html +== table-sibling-1b-dyn.html table-sibling-1-ref.html +!= table-sibling-1b-dyn.html table-sibling-1-noref.html +== table-sibling-1c-dyn.html table-sibling-1-ref.html +!= table-sibling-1c-dyn.html table-sibling-1-noref2.html +== table-sibling-2a-dyn.html table-sibling-2-ref.html +!= table-sibling-2a-dyn.html table-sibling-2-noref.html +== table-sibling-2b-dyn.html table-sibling-2-ref.html +!= table-sibling-2b-dyn.html table-sibling-2-noref.html +== table-sibling-2c-dyn.html table-sibling-2-ref.html +!= table-sibling-2c-dyn.html table-sibling-2-noref2.html +== table-sibling-3-dyn.html table-sibling-3-ref.html +!= table-sibling-3-dyn.html table-sibling-3-noref.html +# * table-caption boxes, per CSS 2.1 §9.4.1 (Block formatting contexts): +# "[...] block containers (such as [...] table-captions) [...] +# establish new block formatting contexts for their contents." +# The margins of a table-caption do not collapse with the margins +# of the table wrapper box. They can collapse with the margins of other +# table-captions, though, if they share the same caption-side. +== table-caption-1a.html table-caption-1-ref.html +== table-caption-1b.html table-caption-1-ref.html +== table-caption-1c.html table-caption-1-ref.html +== table-caption-2a.html table-caption-2-ref.html +== table-caption-2b.html table-caption-2-ref.html +== table-caption-2c.html table-caption-2-ref.html +== table-caption-1a-dyn.html table-caption-1-ref.html +== table-caption-1b-dyn.html table-caption-1-ref.html +== table-caption-1c-dyn.html table-caption-1-ref.html +== table-caption-2a-dyn.html table-caption-2-ref.html +== table-caption-2b-dyn.html table-caption-2-ref.html +== table-caption-2c-dyn.html table-caption-2-ref.html +# Note: CSS 2.1 suggests that the 'caption-side' values 'top-outside' and +# 'bottom-outside' will be used in a future CSS Module to restore the +# CSS 2 definition of 'top' and 'bottom' (which is different from CSS 2.1's). +# Since Bug #659828 was fixed, 'top-outside' and 'bottom-outside' act as an +# alias for the CSS 2.1 values 'top' and 'bottom' respectively. +== table-caption-top-1.html table-caption-top-1-ref.html +== table-caption-top-2.html table-caption-top-2-ref.html +== table-caption-top-outside-1.html table-caption-top-1-ref.html +== table-caption-top-outside-2.html table-caption-top-1-ref.html +== table-caption-bottom-1.html table-caption-bottom-1-ref.html +== table-caption-bottom-2.html table-caption-bottom-2-ref.html +== table-caption-bottom-outside-1.html table-caption-bottom-1-ref.html +== table-caption-bottom-outside-2.html table-caption-bottom-1-ref.html +== table-caption-top-1-dyn.html table-caption-top-1-ref.html +== table-caption-top-2-dyn.html table-caption-top-1-ref.html +== table-caption-top-outside-1-dyn.html table-caption-top-1-ref.html +== table-caption-top-outside-2-dyn.html table-caption-top-2-ref.html +== table-caption-bottom-1-dyn.html table-caption-bottom-1-ref.html +== table-caption-bottom-2-dyn.html table-caption-bottom-1-ref.html +== table-caption-bottom-outside-1-dyn.html table-caption-bottom-1-ref.html +== table-caption-bottom-outside-2-dyn.html table-caption-bottom-1-ref.html +fails == caption-sibling-1a.html caption-sibling-1-ref.html # Bug 144517 +!= caption-sibling-1a.html caption-sibling-1-noref.html +fails == caption-sibling-1b.html caption-sibling-1-ref.html # Bug 144517 +!= caption-sibling-1b.html caption-sibling-1-noref.html +fails == caption-sibling-1c.html caption-sibling-1-ref.html # Bug 144517 +!= caption-sibling-1c.html caption-sibling-1-noref2.html +fails == caption-sibling-1a-dyn.html caption-sibling-1-ref.html # Bug 144517 +!= caption-sibling-1a-dyn.html caption-sibling-1-noref.html +fails == caption-sibling-1b-dyn.html caption-sibling-1-ref.html # Bug 144517 +!= caption-sibling-1b-dyn.html caption-sibling-1-noref.html +fails == caption-sibling-1c-dyn.html caption-sibling-1-ref.html # Bug 144517 +!= caption-sibling-1c-dyn.html caption-sibling-1-noref2.html +fails == caption-sibling-2-dyn.html caption-sibling-2-ref.html # Bug 144517 +!= caption-sibling-2-dyn.html caption-sibling-2-noref.html +== caption-child-1.html caption-child-1-ref.html +== caption-child-1-dyn.html caption-child-1-ref.html +# * Multi-column elements, per CSS Multi-column Layout Module +# (Candidate Recommendation 12 April 2011): +# "A multi-column element establishes a new block formatting context [...]" +== column-sibling-1a.html column-sibling-1-ref.html +== column-sibling-1b.html column-sibling-1-ref.html +== column-sibling-1c.html column-sibling-1-ref.html +== column-sibling-1a-dyn.html column-sibling-1-ref.html +== column-sibling-1b-dyn.html column-sibling-1-ref.html +== column-sibling-1c-dyn.html column-sibling-1-ref.html +== column-sibling-2a.html column-sibling-2-ref.html +== column-sibling-2b.html column-sibling-2-ref.html +== column-sibling-2c.html column-sibling-2-ref.html +== column-sibling-2a-dyn.html column-sibling-2-ref.html +== column-sibling-2b-dyn.html column-sibling-2-ref.html +== column-sibling-2c-dyn.html column-sibling-2-ref.html +== column-child-1.html column-child-1-ref.html +== column-child-1-dyn.html column-child-1-ref.html +# * inline-block boxes +# "Margins of inline-block boxes do not collapse +# (not even with their in-flow children)." +== inline-block-sibling-1a.html inline-block-sibling-1-ref.html +== inline-block-sibling-1b.html inline-block-sibling-1-ref.html +== inline-block-sibling-1c.html inline-block-sibling-1-ref.html +== inline-block-sibling-2.html inline-block-sibling-2-ref.html +!= inline-block-sibling-2.html inline-block-sibling-2-noref.html +== inline-block-sibling-1a-dyn.html inline-block-sibling-1-ref.html +== inline-block-sibling-1b-dyn.html inline-block-sibling-1-ref.html +== inline-block-sibling-1c-dyn.html inline-block-sibling-1-ref.html +== inline-block-sibling-2-dyn.html inline-block-sibling-2-ref.html +== inline-block-child-1.html inline-block-child-1-ref.html +== inline-block-child-2.html inline-block-child-2-ref.html +!= inline-block-child-2.html inline-block-child-2-noref.html +== inline-block-child-3.html inline-block-child-3-ref.html +== inline-block-child-1-dyn.html inline-block-child-1-ref.html +== inline-block-child-2-dyn.html inline-block-child-2-ref.html +== inline-block-child-3-dyn.html inline-block-child-3-ref.html +# * absolutely positioned elements +# "Margins of absolutely positioned boxes do not collapse +# (not even with their in-flow children)." +== block-abs-pos-1.html block-abs-pos-1-ref.html +== block-abs-pos-2.html block-abs-pos-2-ref.html +== block-abs-pos-2.html block-abs-pos-2-ref2.html +== block-abs-pos-1-dyn.html block-abs-pos-1-ref.html +== block-abs-pos-2-dyn.html block-abs-pos-2-ref2.html +# * Floats +# "Margins between a floated box and any other box do not collapse +# (not even between a float and its in-flow children)." +== block-float-1a.html block-float-1a-ref.html +== block-float-1a.html block-float-1a-ref2.html +!= block-float-1a.html block-float-1a-noref.html +== block-float-1b.html block-float-1b-ref.html +== block-float-1b.html block-float-1b-ref2.html +!= block-float-1b.html block-float-1b-noref.html +== block-float-2a.html block-float-2a-ref.html +!= block-float-2a.html block-float-2a-noref.html +== block-float-2b.html block-float-2b-ref.html +!= block-float-2b.html block-float-2b-noref.html +== block-float-3a.html block-float-3a-ref.html +== block-float-3b.html block-float-3b-ref.html +== block-float-1a-dyn.html block-float-1a-ref.html +== block-float-1b-dyn.html block-float-1b-ref.html +== block-float-2a-dyn.html block-float-2a-ref.html +== block-float-2b-dyn.html block-float-2b-ref.html +== block-float-3a-dyn.html block-float-3a-ref.html +== block-float-3b-dyn.html block-float-3b-ref.html +# Tests for various cases where clearance is applied and collapsing is +# prevented or only allows for certain margins. +== block-clear-1a.html block-clear-1a-ref.html +== block-clear-1b.html block-clear-1b-ref.html +== block-clear-2.html block-clear-2-ref.html +!= block-clear-2.html block-clear-2-noref.html +== block-clear-3a.html block-clear-3-ref-left.html +== block-clear-3b.html block-clear-3-ref-right.html +== block-clear-3c.html block-clear-3-ref-left.html +== block-clear-3d.html block-clear-3-ref-right.html +== block-clear-3e.html block-clear-3-ref-left.html +== block-clear-3f.html block-clear-3-ref-right.html +== block-clear-4a.html block-clear-4-ref-left.html +== block-clear-4b.html block-clear-4-ref-left.html +== block-clear-4c.html block-clear-4-ref-left.html +== block-clear-4d.html block-clear-4-ref-right.html +== block-clear-4e.html block-clear-4-ref-right.html +== block-clear-4f.html block-clear-4-ref-right.html +== block-clear-5a.html block-clear-5-left-ref.html +== block-clear-5b.html block-clear-5-left-ref.html +== block-clear-5c.html block-clear-5-left-ref.html +== block-clear-5d.html block-clear-5-left-ref.html +== block-clear-5e.html block-clear-5-right-ref.html +== block-clear-5f.html block-clear-5-right-ref.html +== block-clear-5g.html block-clear-5-right-ref.html +== block-clear-5h.html block-clear-5-right-ref.html +fails == block-clear-6a-left.html block-clear-6abc-left-ref.html # Bug 493380 +== block-clear-6b-left.html block-clear-6abc-left-ref.html +== block-clear-6c-left.html block-clear-6abc-left-ref.html +fails == block-clear-6d-left.html block-clear-6def-left-ref1.html # Bug 493380 +fails == block-clear-6d-left.html block-clear-6def-left-ref2.html # Bug 493380 +== block-clear-6e-left.html block-clear-6def-left-ref1.html +== block-clear-6e-left.html block-clear-6def-left-ref2.html +== block-clear-6f-left.html block-clear-6def-left-ref1.html +== block-clear-6f-left.html block-clear-6def-left-ref2.html +fails == block-clear-7a-left.html block-clear-7abcd-left-ref.html # Bug 493380 +fails == block-clear-7b-left.html block-clear-7abcd-left-ref.html # Bug 493380 +fails == block-clear-7c-left.html block-clear-7abcd-left-ref.html # Bug 493380 +== block-clear-7d-left.html block-clear-7abcd-left-ref.html +fails == block-clear-7e-left.html block-clear-7efgh-left-ref1.html # Bug 493380 +fails == block-clear-7e-left.html block-clear-7efgh-left-ref2.html # Bug 493380 +fails == block-clear-7f-left.html block-clear-7efgh-left-ref1.html # Bug 493380 +fails == block-clear-7f-left.html block-clear-7efgh-left-ref2.html # Bug 493380 +fails == block-clear-7g-left.html block-clear-7efgh-left-ref1.html # Bug 493380 +fails == block-clear-7g-left.html block-clear-7efgh-left-ref2.html # Bug 493380 +== block-clear-7h-left.html block-clear-7efgh-left-ref1.html +== block-clear-7h-left.html block-clear-7efgh-left-ref2.html +# "Margins of the root element's box do not collapse." +# Testing the root margins of a generic XML document. +== block-xml-root-1.xml block-xml-root-1-ref.xml +# In XML and XHTML, the html element is not necessarily the root element of +# a document. In that case, the margins of the html element collapse +# like the margins of any other block boxes. +== block-xhtml-root-1a.xhtml block-xhtml-root-1-ref.xhtml +== block-xhtml-root-1b.xhtml block-xhtml-root-1-ref.xhtml +== block-xhtml-root-2.xhtml block-xhtml-root-2-ref.xhtml +== block-xhtml-root-3.xhtml block-xhtml-root-3-ref.xhtml +# When the html element is the root element of the document, its margins +# do not collapse. +== block-xhtml-html-1a.xhtml block-xhtml-html-1-ref.xhtml +== block-xhtml-html-1b.xhtml block-xhtml-html-1-ref.xhtml +== block-xhtml-html-2.xhtml block-xhtml-html-2-ref.xhtml +== block-xhtml-html-3.xhtml block-xhtml-html-3-ref.xhtml +== block-xhtml-html-1a-dyn.xhtml block-xhtml-html-1-ref.xhtml +== block-xhtml-html-1b-dyn.xhtml block-xhtml-html-1-ref.xhtml +== block-xhtml-html-2-dyn.xhtml block-xhtml-html-2-ref.xhtml +== block-xhtml-html-3-dyn.xhtml block-xhtml-html-3-ref.xhtml +# In HTML documents only the html element can be the root element. +# Its margins do not collapse. +== block-html-html-1a.html block-html-html-1-ref.html +== block-html-html-1b.html block-html-html-1-ref.html +== block-html-html-2.html block-html-html-2-ref.html +== block-html-html-3.html block-html-html-3-ref.html +== block-html-html-1a-dyn.html block-html-html-1-ref.html +== block-html-html-1b-dyn.html block-html-html-1-ref.html +== block-html-html-2-dyn.html block-html-html-2-ref.html +== block-html-html-3-dyn.html block-html-html-3-ref.html +# These are older tests that check whether margins on the root element collapse. +== block-root-1a.html block-root-1a-ref.html +== block-root-1a.html block-root-1a-ref2.html +!= block-root-1a.html block-root-1a-noref1.html +!= block-root-1a.html block-root-1a-noref2.html +== block-root-1b.html block-root-1b-ref.html +== block-root-1b.html block-root-1b-ref2.html +== block-html-body-1.html block-html-body-1-ref.html +== block-html-body-1.html block-html-body-1-ref2.html +!= block-html-body-1.html block-html-body-1-noref.html +# Some basic tests for margins given in percent and em. +== block-percent-1.html block-percent-1-ref.html +== block-percent-1-dyn.html block-percent-1-ref.html +== block-percent-2.html block-percent-2-ref.html +== block-percent-2-dyn.html block-percent-2-ref.html +== block-em-length-1.html block-em-length-1-ref.html +== block-em-length-1-dyn.html block-em-length-1-ref.html +# Other tests. +== dynamic-add-text-1.html dynamic-add-text-1-ref.html # Bug 467321 +== scrollable-vertical-margin.html scrollable-vertical-margin-ref.html +== scrollable-horizontal-margin.html scrollable-horizontal-margin-ref.html diff --git a/layout/reftests/margin-collapsing/scrollable-horizontal-margin-ref.html b/layout/reftests/margin-collapsing/scrollable-horizontal-margin-ref.html new file mode 100644 index 000000000..358c1f2bb --- /dev/null +++ b/layout/reftests/margin-collapsing/scrollable-horizontal-margin-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE HTML> +<html><head> + <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> + <title>Testcase for bug 724352</title> + <style type="text/css"> + + html,body { + color:black; background-color:white; font-size:16px; padding:0; margin:0; + } + +x1,x2,x3,x4,x5,x6 { display:block; } +x2 { overflow:auto; width:100px; background:grey; } +x4 { width: 70px; } +x3 { width: 70px; padding-left: 20px; padding-right: 10px; } + </style> +</head> +<body> + +<x1><x2 style="height:50px;"> + <x3><x4 style="height:20px; background:lime; "></x4></x3> +</x2></x1> + + +</body> +</html> diff --git a/layout/reftests/margin-collapsing/scrollable-horizontal-margin.html b/layout/reftests/margin-collapsing/scrollable-horizontal-margin.html new file mode 100644 index 000000000..5616b36fc --- /dev/null +++ b/layout/reftests/margin-collapsing/scrollable-horizontal-margin.html @@ -0,0 +1,24 @@ +<!DOCTYPE HTML> +<html><head> + <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> + <title>Testcase for bug 724352</title> + <style type="text/css"> + + html,body { + color:black; background-color:white; font-size:16px; padding:0; margin:0; + } + +x1,x2,x3,x4,x5,x6 { display:block; } +x2 { overflow:auto; width:100px; background:grey; } +x4 { width: 70px; margin: 0 20px; } + </style> +</head> +<body> + +<x1><x2 style="height:50px;"> + <x4 style="height:20px; background:lime; "></x4> +</x2></x1> + + +</body> +</html> diff --git a/layout/reftests/margin-collapsing/scrollable-vertical-margin-ref.html b/layout/reftests/margin-collapsing/scrollable-vertical-margin-ref.html new file mode 100644 index 000000000..280f97533 --- /dev/null +++ b/layout/reftests/margin-collapsing/scrollable-vertical-margin-ref.html @@ -0,0 +1,66 @@ +<!DOCTYPE HTML> +<html><head> + <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> + <title>Testcase for bug 724352</title> + <style type="text/css"> + + html,body { + color:black; background-color:white; font-size:16px; padding:0; margin:0; + } + +x1,x2,x3,x4,x5,x6 { display:block; } +x7 {display:block; height:20px;background:lime;} + </style> +</head> +<body> + +<x1><x2 style="overflow:auto; background:grey; height:50px;"> + <x3><x4 style="padding:20px 0 10px 0; height:20px;"><x7></x7></x4></x3> +</x2> +<x6 style="padding-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:70px;"> + <x3 style="padding-bottom:30px"><x4 style="padding-top:20px; height:20px;"><x7></x7></x4></x3> +</x2> +<x6 style="padding-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:60px;"> + <x3 style="padding-bottom:10px"><x4 style="padding-top:20px; height:20px;"><x7></x7></x4></x3> +</x2> +<x6 style="padding-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:50px;"> + <x3 style="padding-bottom:10px"><x4 style="padding-top:20px; height:20px;"><x7></x7></x4></x3> +</x2> +<x6 style="padding-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:60px;"> + <x3><x4 style="padding:20px 0; height:20px;"><x7></x7></x4></x3> +</x2> +<x6 style="padding-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:60px;"> + <x3><x4 style="padding:20px 0; height:20px;"><x7></x7></x4></x3> +</x2> +<x6 style="padding-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:50px;"> + <x3><x4 style="padding:10px 0 20px 0; height:20px;"><x7></x7></x4></x3> +</x2> +<x6 style="padding-top:10px">x</x6></x1> + + +</body> +</html> diff --git a/layout/reftests/margin-collapsing/scrollable-vertical-margin.html b/layout/reftests/margin-collapsing/scrollable-vertical-margin.html new file mode 100644 index 000000000..d752417a3 --- /dev/null +++ b/layout/reftests/margin-collapsing/scrollable-vertical-margin.html @@ -0,0 +1,65 @@ +<!DOCTYPE HTML> +<html><head> + <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> + <title>Testcase for bug 724352</title> + <style type="text/css"> + + html,body { + color:black; background-color:white; font-size:16px; padding:0; margin:0; + } + +x1,x2,x3,x4,x5,x6 { display:block; } + </style> +</head> +<body> + +<x1><x2 style="overflow:auto; background:grey; height:50px;"> + <x3 style="margin-bottom:-10px"><x4 style="margin:20px 0; height:20px; background:lime; "></x4></x3> +</x2> +<x6 style="margin-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:70px;"> + <x3 style="margin-bottom:30px"><x4 style="margin:20px 0; height:20px; background:lime; "></x4></x3> +</x2> +<x6 style="margin-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:60px;"> + <x3 style="margin-bottom:10px"><x4 style="margin:20px 0; height:20px; background:lime; "></x4></x3> +</x2> +<x6 style="margin-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:50px;"> + <x3 style="margin-bottom:20px"><x4 style="margin:20px 0 -10px 0; height:20px; background:lime; "></x4></x3> +</x2> +<x6 style="margin-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:60px;"> + <x3 style="margin-bottom:20px"><x4 style="margin:20px 0; height:20px; background:lime; "></x4></x3> +</x2> +<x6 style="margin-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:60px;"> + <x3 style="margin-top:20px"><x4 style="margin:20px 0; height:20px; background:lime; "></x4></x3> +</x2> +<x6 style="margin-top:10px">x</x6></x1> + + + +<x1><x2 style="overflow:auto; background:grey; height:50px;"> + <x3 style="margin-top:-10px"><x4 style="margin:20px 0; height:20px; background:lime; "></x4></x3> +</x2> +<x6 style="margin-top:10px">x</x6></x1> + + +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-1-ref.html b/layout/reftests/margin-collapsing/table-caption-1-ref.html new file mode 100644 index 000000000..0b98396d1 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-1-ref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#table { + width: 100px; + margin-right: auto; +} +#caption { + height: 20px; + background-color: blue; +} +.spacer { + height: 30px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div class="spacer"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div class="spacer"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-1a-dyn.html b/layout/reftests/margin-collapsing/table-caption-1a-dyn.html new file mode 100644 index 000000000..d70070d14 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-1a-dyn.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#table { + display: table; + width: 100px; +} +#caption { + display: table-cell; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#block2 { + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-1a.html b/layout/reftests/margin-collapsing/table-caption-1a.html new file mode 100644 index 000000000..b03965a6e --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-1a.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#table { + display: table; + width: 100px; +} +#caption { + display: table-caption; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#block2 { + margin-top: 10px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-1b-dyn.html b/layout/reftests/margin-collapsing/table-caption-1b-dyn.html new file mode 100644 index 000000000..8dc7c2921 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-1b-dyn.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 20px; +} +#table { + display: table; + width: 100px; +} +#caption { + display: table-cell; + height: 20px; + margin: 10px 0; + background-color: blue; +} +#block2 { + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-1b.html b/layout/reftests/margin-collapsing/table-caption-1b.html new file mode 100644 index 000000000..20cc93bec --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-1b.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 20px; +} +#table { + display: table; + width: 100px; +} +#caption { + display: table-caption; + height: 20px; + margin: 10px 0; + background-color: blue; +} +#block2 { + margin-top: 20px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-1c-dyn.html b/layout/reftests/margin-collapsing/table-caption-1c-dyn.html new file mode 100644 index 000000000..4e386b5f6 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-1c-dyn.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 15px; +} +#table { + display: table; + width: 100px; +} +#caption { + display: table-cell; + height: 20px; + margin: 15px 0; + background-color: blue; +} +#block2 { + margin-top: 15px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-1c.html b/layout/reftests/margin-collapsing/table-caption-1c.html new file mode 100644 index 000000000..b7956a130 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-1c.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 15px; +} +#table { + display: table; + width: 100px; +} +#caption { + display: table-caption; + height: 20px; + margin: 15px 0; + background-color: blue; +} +#block2 { + margin-top: 15px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-2-ref.html b/layout/reftests/margin-collapsing/table-caption-2-ref.html new file mode 100644 index 000000000..dbb6e7ec5 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-2-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + margin-bottom: 30px; + background-color: green; +} +#caption { + width: 100px; + height: 20px; + margin-bottom: 30px; + background-color: blue; +} +</style> +</head> +<body> +<div class="separator"></div> +<div> + <div id="caption"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-2a-dyn.html b/layout/reftests/margin-collapsing/table-caption-2a-dyn.html new file mode 100644 index 000000000..d9943ca72 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-2a-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 10px 0; +} +#caption { + display: table-cell; + height: 20px; + margin: 20px 0; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-2a.html b/layout/reftests/margin-collapsing/table-caption-2a.html new file mode 100644 index 000000000..f8a71b916 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-2a.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 10px 0; +} +#caption { + display: table-caption; + height: 20px; + margin: 20px 0; + background-color: blue; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-2b-dyn.html b/layout/reftests/margin-collapsing/table-caption-2b-dyn.html new file mode 100644 index 000000000..90f55e032 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-2b-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 20px 0; +} +#caption { + display: table-cell; + height: 20px; + margin: 10px 0; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-2b.html b/layout/reftests/margin-collapsing/table-caption-2b.html new file mode 100644 index 000000000..4d2cc46ce --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-2b.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 20px 0; +} +#caption { + display: table-caption; + height: 20px; + margin: 10px 0; + background-color: blue; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-2c-dyn.html b/layout/reftests/margin-collapsing/table-caption-2c-dyn.html new file mode 100644 index 000000000..6d79c3cd3 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-2c-dyn.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 15px 0; +} +#caption { + display: table-cell; + height: 20px; + margin: 15px 0; + background-color: blue; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="separator"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-2c.html b/layout/reftests/margin-collapsing/table-caption-2c.html new file mode 100644 index 000000000..43eb54842 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-2c.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.separator { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 15px 0; +} +#caption { + display: table-caption; + height: 20px; + margin: 15px 0; + background-color: blue; +} +</style> +</head> +<body> +<div class="separator"></div> +<div id="table"> + <div id="caption"></div> +</div> +<div class="separator"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-1-dyn.html b/layout/reftests/margin-collapsing/table-caption-bottom-1-dyn.html new file mode 100644 index 000000000..dd456eb47 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-1-dyn.html @@ -0,0 +1,48 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#block2 { + margin-top: 10px; +} +#table { + display: table; +} +#caption { + display: table-cell; + caption-side: bottom; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-1-ref.html b/layout/reftests/margin-collapsing/table-caption-bottom-1-ref.html new file mode 100644 index 000000000..9f554fcdc --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-1-ref.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + width: 100px; +} +#caption { + height: 20px; + background-color: blue; +} +#cell { + height: 20px; + background-color: orange; +} +#spacer1 { + height: 10px; +} +#spacer2 { + height: 20px; +} +#spacer3 { + height: 30px; +} +</style> +</head> +<body> +<div class="block"></div> +<div id="spacer1"></div> +<div id="table"> + <div id="cell"></div> + <div id="spacer2"></div> + <div id="caption"></div> +</div> +<div id="spacer3"></div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-1.html b/layout/reftests/margin-collapsing/table-caption-bottom-1.html new file mode 100644 index 000000000..2bfa7c997 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-1.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#block2 { + margin-top: 10px; +} +#table { + display: table; +} +#caption { + display: table-caption; + caption-side: bottom; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-2-dyn.html b/layout/reftests/margin-collapsing/table-caption-bottom-2-dyn.html new file mode 100644 index 000000000..7363e73cd --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-2-dyn.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + display: table; + margin: 10px 0; +} +#caption { + display: table-cell; + caption-side: bottom; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-2-ref.html b/layout/reftests/margin-collapsing/table-caption-bottom-2-ref.html new file mode 100644 index 000000000..9f18a8891 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-2-ref.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + margin-top: 10px; + width: 100px; +} +#cell { + height: 20px; + margin-bottom: 20px; + background-color: orange; +} +#caption { + height: 20px; + margin-bottom: 30px; + background-color: blue; +} +</style> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="cell"></div> + <div id="caption"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-2.html b/layout/reftests/margin-collapsing/table-caption-bottom-2.html new file mode 100644 index 000000000..9b3880c0f --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-2.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + display: table; + margin: 10px 0; +} +#caption { + display: table-caption; + caption-side: bottom; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-outside-1-dyn.html b/layout/reftests/margin-collapsing/table-caption-bottom-outside-1-dyn.html new file mode 100644 index 000000000..c31a8e6ef --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-outside-1-dyn.html @@ -0,0 +1,48 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#block2 { + margin-top: 10px; +} +#table { + display: table; +} +#caption { + display: table-cell; + caption-side: bottom-outside; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-outside-1.html b/layout/reftests/margin-collapsing/table-caption-bottom-outside-1.html new file mode 100644 index 000000000..5a4c9c7c8 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-outside-1.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#block2 { + margin-top: 10px; +} +#table { + display: table; +} +#caption { + display: table-caption; + caption-side: bottom-outside; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-outside-2-dyn.html b/layout/reftests/margin-collapsing/table-caption-bottom-outside-2-dyn.html new file mode 100644 index 000000000..c1d6595af --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-outside-2-dyn.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + display: table; + margin: 10px 0; +} +#caption { + display: table-cell; + caption-side: bottom-outside; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-bottom-outside-2.html b/layout/reftests/margin-collapsing/table-caption-bottom-outside-2.html new file mode 100644 index 000000000..c730424e7 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-bottom-outside-2.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + display: table; + margin: 10px 0; +} +#caption { + display: table-caption; + caption-side: bottom-outside; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-1-dyn.html b/layout/reftests/margin-collapsing/table-caption-top-1-dyn.html new file mode 100644 index 000000000..8e456adeb --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-1-dyn.html @@ -0,0 +1,48 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#block2 { + margin-top: 10px; +} +#table { + display: table; +} +#caption { + display: table-cell; + caption-side: top; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-1-ref.html b/layout/reftests/margin-collapsing/table-caption-top-1-ref.html new file mode 100644 index 000000000..0c622dfe9 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-1-ref.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + width: 100px; +} +#caption { + height: 20px; + background-color: blue; +} +#cell { + height: 20px; + background-color: orange; +} +#spacer1 { + height: 10px; +} +#spacer2 { + height: 20px; +} +#spacer3 { + height: 30px; +} +</style> +</head> +<body> +<div class="block"></div> +<div id="spacer3"></div> +<div id="table"> + <div id="caption"></div> +<div id="spacer2"></div> + <div id="cell"></div> +</div> +<div id="spacer1"></div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-1.html b/layout/reftests/margin-collapsing/table-caption-top-1.html new file mode 100644 index 000000000..55af9b4e5 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-1.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#block2 { + margin-top: 10px; +} +#table { + display: table; +} +#caption { + display: table-caption; + caption-side: top; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-2-dyn.html b/layout/reftests/margin-collapsing/table-caption-top-2-dyn.html new file mode 100644 index 000000000..01dd40ad8 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-2-dyn.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 10px 0; +} +#caption { + display: table-cell; + caption-side: top; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + height: 20px; + background-color: orange; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-2-ref.html b/layout/reftests/margin-collapsing/table-caption-top-2-ref.html new file mode 100644 index 000000000..f845aba14 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-2-ref.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; + margin-bottom: 30px; +} +#table { + width: 100px; +} +#caption { + height: 20px; + margin-bottom: 20px; + background-color: blue; +} +#cell { + height: 20px; + margin-bottom: 10px; + background-color: orange; +} +</style> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-2.html b/layout/reftests/margin-collapsing/table-caption-top-2.html new file mode 100644 index 000000000..884c10687 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-2.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 10px 0; +} +#caption { + display: table-caption; + caption-side: top; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + height: 20px; + background-color: orange; +} +</style> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-outside-1-dyn.html b/layout/reftests/margin-collapsing/table-caption-top-outside-1-dyn.html new file mode 100644 index 000000000..3767070f9 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-outside-1-dyn.html @@ -0,0 +1,48 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#block2 { + margin-top: 10px; +} +#table { + display: table; +} +#caption { + display: table-cell; + caption-side: top-outside; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-outside-1.html b/layout/reftests/margin-collapsing/table-caption-top-outside-1.html new file mode 100644 index 000000000..f159d4297 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-outside-1.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1, #block2 { + height: 20px; + background-color: green; +} +#block1 { + margin-bottom: 10px; +} +#block2 { + margin-top: 10px; +} +#table { + display: table; +} +#caption { + display: table-caption; + caption-side: top-outside; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + width: 100px; + height: 20px; + background-color: orange; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-outside-2-dyn.html b/layout/reftests/margin-collapsing/table-caption-top-outside-2-dyn.html new file mode 100644 index 000000000..f01fa94f8 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-outside-2-dyn.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 10px 0; +} +#caption { + display: table-cell; + caption-side: top-outside; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + height: 20px; + background-color: orange; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('caption').style.display = 'table-caption'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-caption-top-outside-2.html b/layout/reftests/margin-collapsing/table-caption-top-outside-2.html new file mode 100644 index 000000000..d5516f8c7 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-caption-top-outside-2.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +.block { + height: 20px; + background-color: green; +} +#table { + display: table; + width: 100px; + margin: 10px 0; +} +#caption { + display: table-caption; + caption-side: top-outside; + height: 20px; + margin: 20px 0; + background-color: blue; +} +#cell { + display: table-cell; + height: 20px; + background-color: orange; +} +</style> +</head> +<body> +<div class="block"></div> +<div id="table"> + <div id="caption"></div> + <div id="cell"></div> +</div> +<div class="block"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-1-noref.html b/layout/reftests/margin-collapsing/table-sibling-1-noref.html new file mode 100644 index 000000000..c04fc069c --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-1-noref.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + display: block; + height: 20px; + background-color: green; + margin-bottom: 30px; +} +#table { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-bottom: 30px; +} +#block2 { + display: block; + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-1-noref2.html b/layout/reftests/margin-collapsing/table-sibling-1-noref2.html new file mode 100644 index 000000000..256cae9f0 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-1-noref2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + display: block; + height: 20px; + background-color: green; + margin-bottom: 40px; +} +#table { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-bottom: 40px; +} +#block2 { + display: block; + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-1-ref.html b/layout/reftests/margin-collapsing/table-sibling-1-ref.html new file mode 100644 index 000000000..e12feb34f --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-1-ref.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + display: block; + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#table { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-bottom: 20px; +} +#block2 { + display: block; + height: 20px; + background-color: blue; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-1a-dyn.html b/layout/reftests/margin-collapsing/table-sibling-1a-dyn.html new file mode 100644 index 000000000..a558c3154 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-1a-dyn.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1 { + display: block; + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#table { + display: none; + height: 20px; width: 100px; + background-color: red; + margin-top: 20px; + margin-bottom: 20px; +} +#block2 { + display: block; + height: 20px; + background-color: blue; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('table').style.display = 'table'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-1a.html b/layout/reftests/margin-collapsing/table-sibling-1a.html new file mode 100644 index 000000000..b7e76316e --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-1a.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + display: block; + height: 20px; + background-color: green; + margin-bottom: 10px; +} +#table { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-top: 20px; + margin-bottom: 20px; +} +#block2 { + display: block; + height: 20px; + background-color: blue; + margin-top: 10px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-1b-dyn.html b/layout/reftests/margin-collapsing/table-sibling-1b-dyn.html new file mode 100644 index 000000000..580255986 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-1b-dyn.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1 { + display: block; + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#table { + display: none; + height: 20px; width: 100px; + background-color: red; + margin-top: 10px; + margin-bottom: 10px; +} +#block2 { + display: block; + height: 20px; + background-color: blue; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('table').style.display = 'table'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-1b.html b/layout/reftests/margin-collapsing/table-sibling-1b.html new file mode 100644 index 000000000..46033bff6 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-1b.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + display: block; + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#table { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-top: 10px; + margin-bottom: 10px; +} +#block2 { + display: block; + height: 20px; + background-color: blue; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-1c-dyn.html b/layout/reftests/margin-collapsing/table-sibling-1c-dyn.html new file mode 100644 index 000000000..a22cf00d9 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-1c-dyn.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#block1 { + display: block; + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#table { + display: none; + height: 20px; width: 100px; + background-color: red; + margin-top: 20px; + margin-bottom: 20px; +} +#block2 { + display: block; + height: 20px; + background-color: blue; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('table').style.display = 'table'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="block1"></div> +<div id="table"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-1c.html b/layout/reftests/margin-collapsing/table-sibling-1c.html new file mode 100644 index 000000000..76c90a1ae --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-1c.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#block1 { + display: block; + height: 20px; + background-color: green; + margin-bottom: 20px; +} +#table { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-top: 20px; + margin-bottom: 20px; +} +#block2 { + display: block; + height: 20px; + background-color: blue; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="block1"></div> +<div id="table"></div> +<div id="block2"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-2-noref.html b/layout/reftests/margin-collapsing/table-sibling-2-noref.html new file mode 100644 index 000000000..f0ffec823 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-2-noref.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 30px; +} +#table2 { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-bottom: 30px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; +} +</style> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-2-noref2.html b/layout/reftests/margin-collapsing/table-sibling-2-noref2.html new file mode 100644 index 000000000..3d476c01d --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-2-noref2.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 40px; +} +#table2 { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-bottom: 40px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; +} +</style> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-2-ref.html b/layout/reftests/margin-collapsing/table-sibling-2-ref.html new file mode 100644 index 000000000..f46d5b8dd --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-2-ref.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 20px; +} +#table2 { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-bottom: 20px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; +} +</style> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-2a-dyn.html b/layout/reftests/margin-collapsing/table-sibling-2a-dyn.html new file mode 100644 index 000000000..a09d118a8 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-2a-dyn.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 10px; +} +#table2 { + display: none; + height: 20px; width: 100px; + background-color: red; + margin-top: 20px; + margin-bottom: 20px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; + margin-top: 10px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('table2').style.display = 'table'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-2a.html b/layout/reftests/margin-collapsing/table-sibling-2a.html new file mode 100644 index 000000000..de9767135 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-2a.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 10px; +} +#table2 { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-top: 20px; + margin-bottom: 20px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; + margin-top: 10px; +} +</style> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-2b-dyn.html b/layout/reftests/margin-collapsing/table-sibling-2b-dyn.html new file mode 100644 index 000000000..f0c705106 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-2b-dyn.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 20px; +} +#table2 { + display: none; + height: 20px; width: 100px; + background-color: red; + margin-top: 10px; + margin-bottom: 10px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('table2').style.display = 'table'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-2b.html b/layout/reftests/margin-collapsing/table-sibling-2b.html new file mode 100644 index 000000000..20017bda1 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-2b.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 20px; +} +#table2 { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-top: 10px; + margin-bottom: 10px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-2c-dyn.html b/layout/reftests/margin-collapsing/table-sibling-2c-dyn.html new file mode 100644 index 000000000..0a3047104 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-2c-dyn.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 20px; +} +#table2 { + display: none; + height: 20px; width: 100px; + background-color: red; + margin-top: 20px; + margin-bottom: 20px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('table2').style.display = 'table'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-2c.html b/layout/reftests/margin-collapsing/table-sibling-2c.html new file mode 100644 index 000000000..cb063c706 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-2c.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 20px; +} +#table2 { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-top: 20px; + margin-bottom: 20px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; + margin-top: 20px; +} +</style> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-3-dyn.html b/layout/reftests/margin-collapsing/table-sibling-3-dyn.html new file mode 100644 index 000000000..49878f453 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-3-dyn.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 10px; +} +#table2 { + display: table; + height: 20px; width: 100px; + background-color: red; + margin-top: 20px; + margin-bottom: 10px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; + margin-top: 20px; +} +</style> +<script type="text/javascript"> +function test() { + document.getElementById('table2').style.display = 'none'; + document.documentElement.removeAttribute('class'); +} +document.addEventListener('MozReftestInvalidate', test, false); +</script> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-3-noref.html b/layout/reftests/margin-collapsing/table-sibling-3-noref.html new file mode 100644 index 000000000..69952b902 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-3-noref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 30px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; +} +</style> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> diff --git a/layout/reftests/margin-collapsing/table-sibling-3-ref.html b/layout/reftests/margin-collapsing/table-sibling-3-ref.html new file mode 100644 index 000000000..9b1dc0724 --- /dev/null +++ b/layout/reftests/margin-collapsing/table-sibling-3-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> +<head> +<style type="text/css"> +#table1 { + display: table; + height: 20px; width: 100px; + background-color: green; + margin-bottom: 20px; +} +#table3 { + display: table; + height: 20px; width: 100px; + background-color: blue; +} +</style> +</head> +<body> +<div id="table1"></div> +<div id="table2"></div> +<div id="table3"></div> +</body> +</html> |