css - 防止由于内部文本而调整 div 大小

Question

这是我的代码：

<div>
  <table>
    <tr><td>
      <img ...>
    </td></tr>
    <tr><td>
      <p style="text-overflow: ellipsis;white-space: nowrap;">HERE MAY BE SONE VERY LONG TEST!!!</p>
    </td></tr>
  </table>
</div>

我希望我的 div 的宽度与我的图像一样宽，但是由于我不知道我的图像有多宽，所以我无法为 p 指定一个宽度以使其保持在界限内。

我正在寻找仅 html(+css) 的解决方案，如果有的话。我知道如何在 js 中完成此操作，但是由于图像大小会随着时间而改变，因此会变得很混乱。

有没有办法在纯 html/css 中做到这一点？

Answer 1

您可以简单地将表格的宽度设置为非常小：

小提琴

table
{
    width: 1px;
}