spacing-attributes-001.html (3795B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>Test framespacing/rowspacing/columnspacing attributes</title> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=330964"/> 8 </head> 9 <body> 10 11 <math> 12 <mtable framespacing="7px 20px" frame="solid" rowspacing="11px 27px" columnspacing="5px 16px" 13 style="border-width: 2px;" id="mtable0"> 14 <mtr> 15 <mtd id="mtd0"> 16 <mn>X</mn> 17 </mtd> 18 <mtd id="mtd1"> 19 <mn>X</mn> 20 </mtd> 21 <mtd id="mtd2"> 22 <mn>X</mn> 23 </mtd> 24 </mtr> 25 <mtr> 26 <mtd id="mtd3"> 27 <mn>X</mn> 28 </mtd> 29 <mtd id="mtd4"> 30 <mn>X</mn> 31 </mtd> 32 <mtd id="mtd5"> 33 <mn>X</mn> 34 </mtd> 35 </mtr> 36 <mtr> 37 <mtd id="mtd6"> 38 <mn>X</mn> 39 </mtd> 40 <mtd id="mtd7"> 41 <mn>X</mn> 42 </mtd> 43 <mtd id="mtd8"> 44 <mn>X</mn> 45 </mtd> 46 </mtr> 47 </mtable> 48 </math> 49 50 <script type="application/javascript"> 51 52 var epsilon = 2; 53 54 rectTable = document.getElementById("mtable0").getBoundingClientRect(); 55 rect0 = document.getElementById("mtd0").getBoundingClientRect(); 56 rect1 = document.getElementById("mtd1").getBoundingClientRect(); 57 rect2 = document.getElementById("mtd2").getBoundingClientRect(); 58 rect3 = document.getElementById("mtd3").getBoundingClientRect(); 59 rect4 = document.getElementById("mtd4").getBoundingClientRect(); 60 rect5 = document.getElementById("mtd5").getBoundingClientRect(); 61 rect6 = document.getElementById("mtd6").getBoundingClientRect(); 62 rect7 = document.getElementById("mtd7").getBoundingClientRect(); 63 rect8 = document.getElementById("mtd8").getBoundingClientRect(); 64 test(function() { 65 assert_approx_equals(rect1.left - rect0.right, 5, epsilon); 66 assert_approx_equals(rect2.left - rect1.right, 16, epsilon); 67 assert_approx_equals(rect4.left - rect3.right, 5, epsilon); 68 assert_approx_equals(rect5.left - rect4.right, 16, epsilon); 69 assert_approx_equals(rect7.left - rect6.right, 5, epsilon); 70 assert_approx_equals(rect8.left - rect7.right, 16, epsilon); 71 }, "columnspacing"); 72 test(function() { 73 assert_approx_equals(rect3.top - rect0.bottom, 11, epsilon); 74 assert_approx_equals(rect4.top - rect1.bottom, 11, epsilon); 75 assert_approx_equals(rect5.top - rect2.bottom, 11, epsilon); 76 assert_approx_equals(rect6.top - rect3.bottom, 27, epsilon); 77 assert_approx_equals(rect7.top - rect4.bottom, 27, epsilon); 78 assert_approx_equals(rect8.top - rect5.bottom, 27, epsilon); 79 }, "rowspacing"); 80 // Remember to subtract border 81 test(function() { 82 assert_approx_equals(rect0.left - rectTable.left - 2, 7, epsilon); 83 assert_approx_equals(rect3.left - rectTable.left - 2, 7, epsilon); 84 assert_approx_equals(rect6.left - rectTable.left - 2, 7, epsilon); 85 }, "framespacing left"); 86 test(function() { 87 assert_approx_equals(rect0.top - rectTable.top - 2, 20, epsilon); 88 assert_approx_equals(rect1.top - rectTable.top - 2, 20, epsilon); 89 assert_approx_equals(rect2.top - rectTable.top - 2, 20, epsilon); 90 }, "framespacing top"); 91 test(function() { 92 assert_approx_equals(rectTable.bottom - rect6.bottom - 2, 20, epsilon); 93 assert_approx_equals(rectTable.bottom - rect7.bottom - 2, 20, epsilon); 94 assert_approx_equals(rectTable.bottom - rect8.bottom - 2, 20, epsilon); 95 }, "framespacing bottom"); 96 test(function() { 97 assert_approx_equals(rectTable.right - rect2.right - 2, 7, epsilon); 98 assert_approx_equals(rectTable.right - rect5.right - 2, 7, epsilon); 99 assert_approx_equals(rectTable.right - rect8.right - 2, 7, epsilon); 100 }, "framespacing right"); 101 </script> 102 </body> 103 </html>