layout/reftests/margin-collapsing/table-caption-bottom-1-dyn.html

   1 <!DOCTYPE html>
   2 <html class="reftest-wait">
   3 <head>
   4 <style type="text/css">
   5 #block1, #block2 {
   6  height: 20px;
   7  background-color: green;
   8 }
   9 #block1 {
  10  margin-bottom: 10px;
  11 }
  12 #block2 {
  13  margin-top: 10px;
  14 }
  15 #table {
  16  display: table;
  17 }
  18 #caption {
  19  display: table-cell;
  20  caption-side: bottom;
  21  height: 20px;
  22  margin: 20px 0;
  23  background-color: blue;
  24 }
  25 #cell {
  26  display: table-cell;
  27  width: 100px;
  28  height: 20px;
  29  background-color: orange;
  30 }
  31 </style>
  32 <script type="text/javascript">
  33 function test() {
  34  document.getElementById('caption').style.display = 'table-caption';
  35  document.documentElement.removeAttribute('class');
  36 }
  37 document.addEventListener('MozReftestInvalidate', test);
  38 </script>
  39 </head>
  40 <body>
  41 <div id="block1"></div>
  42 <div id="table">
  43  <div id="caption"></div>
  44  <div id="cell"></div>
  45 </div>
  46 <div id="block2"></div>
  47 </body>
  48 </html>