td-with-subpixel-padding-vertical-rl.html (1560B)
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 td div { 7 display: inline-block; 8 width: 20px; 9 height: 20px; 10 background: blue; 11 } 12 </style> 13 Passes if each column (logical row) has two blue squares. 14 <div style="writing-mode: vertical-rl"> 15 <table> 16 <tr> 17 <td class='target' style="padding: 0.8px 0"><div></div> <div></div></td> 18 <td style="padding: 0.8px 0; width: 30px"></td> 19 </tr> 20 </table> 21 <table> 22 <tr> 23 <td class='target' style="padding: 1px 0"><div></div> <div></div></td> 24 <td style="padding: 1px 0; width: 30px"></td> 25 </tr> 26 </table> 27 <table> 28 <tr> 29 <td class='target' style="padding: 1.3px 0"><div></div> <div></div></td> 30 <td style="padding: 1.3px 0; width: 30px"></td> 31 </tr> 32 </table> 33 <table> 34 <tr> 35 <td class='target' style="padding: 1.5px 0"><div></div> <div></div></td> 36 <td style="padding: 1.5px 0; width: 30px"></td> 37 </tr> 38 </table> 39 <table> 40 <tr> 41 <td class='target' style="padding: 1.7px 0"><div></div> <div></div></td> 42 <td style="padding: 1.7px 0; width: 30px"></td> 43 </tr> 44 </table> 45 </div> 46 <script> 47 test(() => { 48 var targets = document.getElementsByClassName('target'); 49 for (var i = 0; i < targets.length; ++i) { 50 var divs = targets[i].getElementsByTagName('div'); 51 assert_equals(divs.length, 2); 52 assert_equals(divs[0].offsetLeft, divs[1].offsetLeft, 'Contents of td.target[' + i + '] should not wrap'); 53 } 54 }); 55 </script>