Bug 63895 (Part 3) - Add tests for positioned internal table objects serving as absolute containing blocks. r=dbaron
--- a/layout/reftests/abs-pos/reftest.list
+++ b/layout/reftests/abs-pos/reftest.list
@@ -1,15 +1,35 @@
== font-size-wrap.html font-size-wrap-ref.html
== abs-pos-auto-margin-1.html abs-pos-auto-margin-1-ref.html
fuzzy-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)&&!layersGPUAccelerated&&!azureSkia,73,1) == auto-offset-inline-block-1.html auto-offset-inline-block-1-ref.html # bug 696670
== fieldset-1.html fieldset-1-ref.html
== table-1.html table-1-ref.html
== table-2.html table-2-ref.html
== table-3.html table-3-ref.html
+== table-cell-1.html table-internal-1-ref.html
+== table-cell-2.html table-internal-2-ref.html
+== table-cell-3.html table-internal-3-ref.html
+== table-cell-4.html table-internal-4-ref.html
+== table-row-1.html table-internal-1-ref.html
+== table-row-2.html table-internal-2-ref.html
+== table-row-3.html table-internal-3-ref.html
+== table-row-4.html table-internal-4-ref.html
+== table-row-group-1.html table-internal-1-ref.html
+== table-row-group-2.html table-internal-2-ref.html
+== table-row-group-3.html table-internal-3-ref.html
+== table-row-group-4.html table-internal-4-ref.html
+== table-header-group-1.html table-internal-1-ref.html
+== table-header-group-2.html table-internal-2-ref.html
+== table-header-group-3.html table-internal-3-ref.html
+== table-header-group-4.html table-internal-4-ref.html
+== table-footer-group-1.html table-internal-1-ref.html
+== table-footer-group-2.html table-internal-2-ref.html
+== table-footer-group-3.html table-internal-3-ref.html
+== table-footer-group-4.html table-internal-4-ref.html
== continuation-positioned-inline-1.html continuation-positioned-inline-ref.html
== continuation-positioned-inline-2.html continuation-positioned-inline-ref.html
== scrollframe-1.html scrollframe-1-ref.html
skip-if(B2G) fuzzy-if(Android,9,185) == scrollframe-2.html scrollframe-2-ref.html #bug 756530
fuzzy-if(gtk2Widget,1,8) == select-1.html select-1-ref.html
fuzzy-if(gtk2Widget,1,8) == select-1-dynamic.html select-1-ref.html
== select-2.html select-2-ref.html
fuzzy-if(gtk2Widget,1,19) fuzzy-if(Android||B2G,17,726) == select-3.html select-3-ref.html
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-cell-1.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <table>
+ <tr>
+ <td id="rel">
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-cell-2.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <div style="position: relative">
+ <table>
+ <tr>
+ <td id="rel">
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-cell-3.html
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="height: 100%">
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td id="rel">
+ <div id="abs"></div>
+ </td>
+ <td></td>
+ </tr>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-cell-4.html
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td, div {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 200px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <colgroup>
+ <col style="width: 15%">
+ <col>
+ </colgroup>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td id="rel">
+ <div id="abs"></div>
+ </td>
+ <td></td>
+ </tr>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-footer-group-1.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <table>
+ <tfoot id="rel">
+ <tr>
+ <td>
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </tfoot>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-footer-group-2.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <div style="position: relative">
+ <table>
+ <tfoot id="rel">
+ <tr>
+ <td>
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </tfoot>
+ </table>
+ </div>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-footer-group-3.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <tbody>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="height: 100%">
+ <td></td>
+ <td></td>
+ </tr>
+ </tbody>
+ <tfoot id="rel">
+ <tr>
+ <td></td>
+ <td>
+ <div id="abs"></div>
+ </td>
+ </tr>
+ </tfoot>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-footer-group-4.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 200px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <colgroup>
+ <col style="width: 15%">
+ <col>
+ </colgroup>
+ <tbody>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ </tbody>
+ <tfoot id="rel">
+ <tr>
+ <td></td>
+ <td>
+ <div id="abs"></div>
+ </td>
+ </tr>
+ </tfoot>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-header-group-1.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <table>
+ <thead id="rel">
+ <tr>
+ <td>
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-header-group-2.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <div style="position: relative">
+ <table>
+ <thead id="rel">
+ <tr>
+ <td>
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </thead>
+ </table>
+ </div>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-header-group-3.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <thead>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="height: 100%">
+ <td></td>
+ <td></td>
+ </tr>
+ </thead>
+ <thead id="rel">
+ <tr>
+ <td></td>
+ <td>
+ <div id="abs"></div>
+ </td>
+ </tr>
+ </thead>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-header-group-4.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 200px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <colgroup>
+ <col style="width: 15%">
+ <col>
+ </colgroup>
+ <thead>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ </thead>
+ <thead id="rel">
+ <tr>
+ <td></td>
+ <td>
+ <div id="abs"></div>
+ </td>
+ </tr>
+ </thead>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-internal-1-ref.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 2px;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <div id="rel">
+ <div class="abs"></div>
+ </div>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-internal-2-ref.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 2px;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <div style="position: relative">
+ <div id="rel">
+ <div class="abs"></div>
+ </div>
+ </div>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-internal-3-ref.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="height: 100%">
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>
+ <div id="rel">
+ <div id="abs"></div>
+ </div>
+ </td>
+ <td></td>
+ </tr>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-internal-4-ref.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td, div {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ height: 1px;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 200.5px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <colgroup>
+ <col style="width: 15%">
+ <col>
+ </colgroup>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td>
+ <div id="rel">
+ <div id="abs"></div>
+ </div>
+ </td>
+ <td></td>
+ </tr>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-row-1.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <table>
+ <tr id="rel">
+ <td>
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-row-2.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <div style="position: relative">
+ <table>
+ <tr id="rel">
+ <td>
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-row-3.html
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="height: 100%">
+ <td></td>
+ <td></td>
+ </tr>
+ <tr id="rel">
+ <td></td>
+ <td>
+ <div id="abs"></div>
+ </td>
+ </tr>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-row-4.html
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td, div {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 200px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <colgroup>
+ <col style="width: 15%">
+ <col>
+ </colgroup>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr id="rel">
+ <td></td>
+ <td>
+ <div id="abs"></div>
+ </td>
+ </tr>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-row-group-1.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <table>
+ <tbody id="rel">
+ <tr>
+ <td>
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-row-group-2.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ .abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ #bad {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not completely cover the blue square.
+ <div class="abs" id="bad"></div>
+ <div style="position: relative">
+ <table>
+ <tbody id="rel">
+ <tr>
+ <td>
+ <div class="abs"></div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-row-group-3.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 25px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <thead>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="height: 100%">
+ <td></td>
+ <td></td>
+ </tr>
+ </thead>
+ <tbody id="rel">
+ <tr>
+ <td></td>
+ <td>
+ <div id="abs"></div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/abs-pos/table-row-group-4.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <style>
+ table {
+ width: 300px;
+ height: 300px;
+ background-color: blue;
+ }
+ td {
+ margin: 0;
+ padding: 0;
+ }
+ #rel {
+ position: relative;
+ margin: 0;
+ padding: 0;
+ }
+ #abs {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ top: 200px;
+ left: 25px;
+ width: 50px;
+ height: 50px;
+ background-color: green;
+ }
+ </style>
+ </head>
+ <body>
+ The green square should not touch the blue square.
+ <table>
+ <colgroup>
+ <col style="width: 15%">
+ <col>
+ </colgroup>
+ <thead>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ </thead>
+ <tbody id="rel">
+ <tr>
+ <td></td>
+ <td>
+ <div id="abs"></div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </body>
+</html>