td-with-subpixel-padding.html (1491B)
1 <!DOCTYPE html> 2 <script src="/resources/testharness.js"></script> 3 <script src="/resources/testharnessreport.js"></script> 4 <link rel="help" href="https://drafts.csswg.org/css-tables/#width-distribution" /> 5 <style> 6 div { 7 display: inline-block; 8 width: 20px; 9 height: 20px; 10 background: blue; 11 } 12 </style> 13 Passes if each row has two blue squares. 14 <table> 15 <tr> 16 <td class='target' style="padding: 0 0.8px"><div></div> <div></div></td> 17 <td style="padding: 0 0.8px; width: 30px"></td> 18 </tr> 19 </table> 20 <table> 21 <tr> 22 <td class='target' style="padding: 0 1px"><div></div> <div></div></td> 23 <td style="padding: 0 1px; width: 30px"></td> 24 </tr> 25 </table> 26 <table> 27 <tr> 28 <td class='target' style="padding: 0 1.3px"><div></div> <div></div></td> 29 <td style="padding: 0 1.3px; width: 30px"></td> 30 </tr> 31 </table> 32 <table> 33 <tr> 34 <td class='target' style="padding: 0 1.5px"><div></div> <div></div></td> 35 <td style="padding: 0 1.5px; width: 30px"></td> 36 </tr> 37 </table> 38 <table> 39 <tr> 40 <td class='target' style="padding: 0 1.7px"><div></div> <div></div></td> 41 <td style="padding: 0 1.7px; width: 30px"></td> 42 </tr> 43 </table> 44 <script> 45 test(() => { 46 var targets = document.getElementsByClassName('target'); 47 for (var i = 0; i < targets.length; ++i) { 48 var divs = targets[i].getElementsByTagName('div'); 49 assert_equals(divs.length, 2); 50 assert_equals(divs[0].offsetTop, divs[1].offsetTop, 'Contents of td.target[' + i + '] should not wrap'); 51 } 52 }); 53 </script>