table-row-group-direction.html (935B)
1 <!DOCTYPE html> 2 <link rel="match" href="table-row-group-direction-ref.html"> 3 <title>Table row-group direction</title> 4 5 <style> 6 table { 7 border-collapse: collapse; 8 } 9 10 td { 11 border: 2px solid black; 12 width: 20px; 13 height: 20px; 14 } 15 16 td.special { 17 border-left: 5px solid green; 18 border-right: 5px solid blue; 19 } 20 </style> 21 22 Normal table with LTR and RTL row groups: 23 <table> 24 <tbody style="direction: ltr"> 25 <tr> 26 <td></td> 27 <td class="special"></td> 28 </tr> 29 </tbody> 30 <tbody style="direction: rtl"> 31 <tr> 32 <td></td> 33 <td class="special"></td> 34 </tr> 35 </tbody> 36 </table> 37 38 <hr> 39 40 RTL table with LTR and RTL row groups: 41 <table style="direction: rtl"> 42 <tbody style="direction: ltr"> 43 <tr> 44 <td></td> 45 <td class="special"></td> 46 </tr> 47 </tbody> 48 <tbody style="direction: rtl"> 49 <tr> 50 <td></td> 51 <td class="special"></td> 52 </tr> 53 </tbody> 54 </table>