| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| table { |
| border-collapse: collapse; |
| border-left: 2px solid red; |
| border-right: 2px solid red; |
| border-bottom: 3px solid green; |
| border-top: 3px solid green; |
| } |
| |
| .leftGreenBorder { |
| border-left: 3px solid green; |
| } |
| |
| .rightGreenBorder { |
| border-right: 3px solid green; |
| } |
| |
| td { |
| height: 100px; |
| width: 100px; |
| } |
| </style> |
| <head> |
| <body> |
| <p>Test for <a href="https://bugs.webkit.org/show_bug.cgi?id=101060">101060</a>: Fix the collapsing border code to handle mixed directionality at the row level</p> |
| <p>This test checks that a table with dir="rtl" and mixed directionality on the row works as expected.</p> |
| <p>The table below should have a 3px green outer border.</p> |
| <table dir="rtl"> |
| <tbody class="rightGreenBorder"> |
| <tr dir="ltr"> |
| <td></td> |
| <td class="leftGreenBorder"></td> |
| </tr> |
| <tr dir="rtl"> |
| <td></td> |
| <td class="leftGreenBorder"></td> |
| </tr> |
| <tr dir="ltr" class="leftGreenBorder"> |
| <td></td> |
| <td></td> |
| </tr> |
| <tr dir="rtl" class="leftGreenBorder"> |
| <td></td> |
| <td></td> |
| </tr> |
| </tbody> |
| </table> |
| </body> |
| </html> |
