| <!DOCTYPE html> |
| <link rel="match" href="table-row-direction-ref.html"> |
| <title>Table row direction</title> |
| |
| <style> |
| table { |
| border-collapse: collapse; |
| } |
| |
| td { |
| border: 2px solid black; |
| width: 20px; |
| height: 20px; |
| } |
| |
| td.special { |
| border-left: 5px solid green; |
| border-right: 5px solid blue; |
| } |
| </style> |
| |
| Normal table with LTR and RTL rows: |
| <table> |
| <tr style="direction: ltr"> |
| <td></td> |
| <td class="special"></td> |
| </tr> |
| <tr style="direction: rtl"> |
| <td></td> |
| <td class="special"></td> |
| </tr> |
| </table> |
| |
| <hr> |
| |
| RTL table with LTR and RTL rows: |
| <table style="direction: rtl"> |
| <tr style="direction: ltr"> |
| <td></td> |
| <td class="special"></td> |
| </tr> |
| <tr style="direction: rtl"> |
| <td></td> |
| <td class="special"></td> |
| </tr> |
| </table> |