如何用CSS强制TD达到一定的高度?

Nat*_*man 4 html css html-table

虽然之前曾提出过类似于问题的一些 问题 ,但这个问题有点不同.

我有一张表看起来像这样的东西:

<table>
 <tr>
  <td style="height: 100px;">
   <img src="..." style="height: 100px;" />
   <img src="..." style="height: 100px; position: relative; top: -100px;" />
  </td>
 </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

这将覆盖第一个图像.然而,td坚持做200px高的,即使只有100px内容.设置td高度没有任何作用,这似乎与其他问题的答案一致.

不过,我没有在嵌入内容的选择DIV和高度设置100px,因为td意志仍然坚持要200px高.

我怎么能告诉td他们只是100px高个子?


编辑:哦,并且使用绝对定位也是不可能的,因为页面中有很多DOM操作,并且东西会被移动 - 而绝对定位的东西则没有.


编辑: jsFiddle示例可以在这里找到.

Pek*_*ica 9

这与td真实无关,但与性质无关position: relative.相对元素的空间在文档流中保留.

摆脱relative,并position: absolute在第一个图像上使用.

编辑:我刚看到你的编辑.嗯.思维.

我想到了两种解决方法:

  • 巴掌overflow: hiddentd

  • 如果这在所有浏览器中都不起作用或者无效(我现在不是100%确定)将两张图片放入一张<div height='100px;'>并放上overflow: hidden它.