Question

当我将页面方向更改为rtl时，表格边距不正确，如此图片所示

但是当我仅从页面中删除dir属性时，每件事情都是正确的，就像在

CSS

  table,td,tr {
            border: 2px solid black;
            padding:0px;
        }

HTML

  <body ><table>
    <tr><td></td><td></td></tr>
    <tr><td></td><td></td></tr>
    </table></body>

这种情况发生在Firefox中，但是在Chrome上，表格在两个方向都是正确的！

如何解决这个问题？

谢谢。

Answer 1

正如评论所说，这是一个错误。

然而

实际上，没有必要为border元素提供tr属性。实际上，除非在非常特殊的情况下，几乎不需要为tr元素提供任何属性。因此，您可以从CSS选择器中删除,tr 如果你这样做，没有什么会变得更糟 - 在LTR模式下，表格看起来仍然相同。但它在RTL模式下也会看起来很好。因此，这是解决您问题的方法。

table,td {
  border: 2px solid black;
  padding: 0px;
}

<body dir="rtl">
  <table>
    <tr> <td>test</td><td>test</td> </tr>
    <tr> <td>test</td><td>test</td> </tr>
  </table>
</body>

当dir =“rtl”时，为什么表边距出错了？

1 个答案: