1673677-1-ref.html (1551B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>Reference case for bug 1673677</title> 4 <style> 5 table, tr, td { 6 border: 1px solid; 7 border-width: 2px 2px 4px 4px; 8 padding: 3px 3px 6px 6px; 9 margin: 8px 8px 12px 12px; 10 border-spacing: 0; 11 } 12 td { 13 vertical-align: baseline; 14 line-height: 0; 15 } 16 .table-nested-cell { 17 /* Explicitly specify inner size, due to bug 1166120 */ 18 inline-size: 125px; 19 block-size: 100px; 20 } 21 .filler-nested-table { 22 inline-size: 50px; 23 block-size: 75px; 24 background: purple; 25 display: inline-block; 26 } 27 .filler { 28 inline-size: 40px; 29 block-size: 30px; 30 background: pink; 31 display: inline-block; 32 } 33 .inner-table { 34 contain: layout; 35 } 36 </style> 37 <table> 38 <tr> 39 <td class="table-nested-cell"> 40 <table class="inner-table" style="writing-mode: vertical-lr;"> 41 <tr><td><div class="filler-nested-table"></div></td></tr> 42 </table> 43 </td> 44 <td><div class="filler"></div></td> 45 </tr> 46 </table> 47 <table style="writing-mode: vertical-lr;"> 48 <tr> 49 <td class="table-nested-cell"> 50 <table class="inner-table" style="writing-mode: horizontal-tb;"> 51 <tr><td><div class="filler-nested-table"></div></td></tr> 52 </table> 53 </td> 54 <td><div class="filler"></div></td> 55 </tr> 56 </table> 57 <table style="writing-mode: vertical-rl;"> 58 <tr> 59 <td class="table-nested-cell"> 60 <table class="inner-table" style="writing-mode: horizontal-tb;"> 61 <tr><td><div class="filler-nested-table"></div></td></tr> 62 </table> 63 </td> 64 <td><div class="filler"></div></td> 65 </tr> 66 </table>