dynamic-columnspan-rowspan-001a.html (3624B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <head> 4 <meta charset="utf-8"> 5 <title>dynamic columnspan/rowspan</title> 6 <link rel="help" href="https://w3c.github.io/mathml-core/#table-or-matrix-mtable"> 7 <meta name="assert" content="Rendering is updated after modifying columnspan"> 8 <link rel="match" href="columnspan-rowspan-ref.html"> 9 <style> 10 mtd { padding: 0; } 11 </style> 12 <script> 13 window.addEventListener("load", () => { 14 // force initial layout so we're sure what we're testing against 15 document.documentElement.getBoundingClientRect(); 16 document.getElementById('mtd').setAttribute("columnspan", 2); 17 document.documentElement.classList.remove('reftest-wait'); 18 }); 19 </script> 20 </head> 21 <body> 22 <p>This test passes if you see a green square.</p> 23 <math> 24 <mtable> 25 <mtr> 26 <mtd id="mtd" columnspan="3"> 27 <mspace width="80px" depth="40px" style="background: green"/> 28 </mtd> 29 <mtd> 30 <mspace width="40px" depth="40px" style="background: green"/> 31 </mtd> 32 <mtd> 33 <mspace width="40px" depth="40px" style="background: green"/> 34 </mtd> 35 <mtd> 36 <mspace width="40px" depth="40px" style="background: green"/> 37 </mtd> 38 </mtr> 39 <mtr> 40 <mtd> 41 <mspace width="40px" depth="40px" style="background: green"/> 42 </mtd> 43 <mtd> 44 <mspace width="40px" depth="40px" style="background: green"/> 45 </mtd> 46 <mtd> 47 <mspace width="40px" depth="40px" style="background: green"/> 48 </mtd> 49 <mtd> 50 <mspace width="40px" depth="40px" style="background: green"/> 51 </mtd> 52 <mtd> 53 <mspace width="40px" depth="40px" style="background: green"/> 54 </mtd> 55 </mtr> 56 <mtr> 57 <mtd> 58 <mspace width="40px" depth="40px" style="background: green"/> 59 </mtd> 60 <mtd> 61 <mspace width="40px" depth="40px" style="background: green"/> 62 </mtd> 63 <mtd> 64 <mspace width="40px" depth="40px" style="background: green"/> 65 </mtd> 66 <mtd> 67 <mspace width="40px" depth="40px" style="background: green"/> 68 </mtd> 69 <mtd> 70 <mspace width="40px" depth="40px" style="background: green"/> 71 </mtd> 72 </mtr> 73 <mtr> 74 <mtd> 75 <mspace width="40px" depth="40px" style="background: green"/> 76 </mtd> 77 <mtd> 78 <mspace width="40px" depth="40px" style="background: green"/> 79 </mtd> 80 <mtd> 81 <mspace width="40px" depth="40px" style="background: green"/> 82 </mtd> 83 <mtd> 84 <mspace width="40px" depth="40px" style="background: green"/> 85 </mtd> 86 <mtd> 87 <mspace width="40px" depth="40px" style="background: green"/> 88 </mtd> 89 </mtr> 90 <mtr> 91 <mtd> 92 <mspace width="40px" depth="40px" style="background: green"/> 93 </mtd> 94 <mtd> 95 <mspace width="40px" depth="40px" style="background: green"/> 96 </mtd> 97 <mtd> 98 <mspace width="40px" depth="40px" style="background: green"/> 99 </mtd> 100 <mtd> 101 <mspace width="40px" depth="40px" style="background: green"/> 102 </mtd> 103 <mtd> 104 <mspace width="40px" depth="40px" style="background: green"/> 105 </mtd> 106 </mtr> 107 </mtable> 108 </math> 109 </body> 110 </html>