如何允许旋转的div溢出表格单元格？

Question

我有一个表格单元格，其div高度为3px，宽度大于单元格宽度。我正在使用transform: rotate并使用div来表示旋转的线条。

即使我使用table-layout:fixed，div也会水平拉伸表格单元格。如果它不适合单元格，我希望它覆盖表格。

<table style="table-layout:fixed">
  <tr>
    <td style="width:20px;">
      <div style="width: 100px;
                  height: 3px;
                  background: #000;
                  transform: rotate(20deg);"></div>
    </td>
    <td style="width:100px;">Why am I pushed away?</td>
  </tr>
</table>

P.S。我在实际代码中使用正确的供应商前缀进行轮换

Answer 1

将position:absolute添加到div可能是您要找的内容吗？

接受的答案： 另一方面，为了使用表格布局，我没有立即捕捉到的东西：修复了你需要在表格上指定一个宽度。在你的情况下，我认为你会希望它在120px，这将实现你所需要的。