third_party/WebKit/LayoutTests/tables/mozilla/bugs/bug22019.html

   1 <html><head>
   2 <style>
   3 table {
   4   width: 600px;
   5   border: 1px solid red;
   6   empty-cells: show;
   7 }
   8 td {
   9   border: 1px solid green;
  10 }
  11 table.inner {margin: 20px; width: 600px;}
  12 </style><head>
  13 <body>
  14
  15 <pre>These tables below all have the HTML + CSS ...
  16
  17 &lt;TABLE>&lt;tr>                                          table {
  18   &lt;td>&lt;TABLE style='margin: 20px; padding: 19px;'>     width: 600px;
  19        &lt;tr>&lt;td>&lt;/td>&lt;/tr>                              border: 1px solid red;
  20        &lt;/TABLE>&lt;/td>                                   empty-cells: show;}
  21 &lt;/tr>&lt;/TABLE>                                        td {
  22                                                        border: 1px solid green;}
  23                                                      table.inner {margin: 20px;}
  24
  25 ... and differ only in the value of 'padding:'. From top table to
  26 bottom: 0px, 10px, 19px, 20px, 25px. Note that for a <u><i>table over-constrained
  27 within another table</i></u>, <i><u>when (padding >=margin)</u></i>, the margin is <i><u>all allocated
  28 to the right hand side</u></i> of the table (and to the left if 'direction: rtl;'.</pre>
  29
  30 <TABLE style='width: 600px; border: 1px dotted blue;'><tr>
  31   <td>600px table for width comparison</td>
  32 </tr></TABLE>
  33
  34 <TABLE><tr>
  35   <td><TABLE class='inner' style='padding: 0px;'>
  36        <tr><td></td></tr>
  37        </TABLE></td>
  38 </tr></TABLE>
  39
  40
  41 <TABLE><tr>
  42   <td><TABLE class='inner' style='padding: 10px;'>
  43        <tr><td></td></tr>
  44        </TABLE></td>
  45 </tr></TABLE>
  46
  47
  48 <TABLE><tr>
  49   <td><TABLE class='inner' style='padding: 19px;'>
  50        <tr><td></td></tr>
  51        </TABLE></td>
  52 </tr></TABLE>
  53
  54
  55 <TABLE><tr>
  56   <td><TABLE class='inner' style='padding: 20px;'>
  57        <tr><td></td></tr>
  58        </TABLE></td>
  59 </tr></TABLE>
  60
  61 <TABLE><tr>
  62   <td><TABLE class='inner' style='padding: 25px;'>
  63        <tr><td></td></tr>
  64        </TABLE></td>
  65 </tr></TABLE>
  66
  67
  68 </body>
  69 </html>
  70
  71