停止一个td元素影响兄弟td元素的高度

Question

我有一个带有3个td元素的tr元素。第一个和最后一个td包含一个图像，中间的td包含文本。中间td的高度受第一和第三td中图像的高度的影响。我如何编码，以便中间td的固定高度始终小于第一个和第三个。或者，问一个问题的另一种方式是，如何编码，以便每个td内容的高度不影响兄弟td？我正在尝试为html电子邮件制作带有环绕效果的功能区..

使用CSS在中间td设置高度不起作用。

 <table align="center" style="width:740px;" border="0" cellpadding="0" cellspacing="0">

    <tr>
          <td>
          <img style="border:none;" src="imageAlt2/sliceLeft.png" /></td>


      <td style=" background:#0082c8; color:#fff; padding:20px 50px;">"The amount of time it has saved us is pretty much immeasurable" </td>

            <td><img style="border:none;" src="imageAlt2/sliceRight.png" /></td>
    </tr>
  </table>

对于下面的屏幕，您会看到中间和第三个td。中间td的高度受第三个td中图像高度的影响。显然，要获得3D效果，中间的td需要更短的高度。

Answer 1

使用CSS指定td上的高度只有在高度大于img的高度时才有效（换句话说，td不能小于img）。这只是表的工作方式。

Answer 2

您是否尝试过CSS overflow（或overflow-y）属性？

overflow: hidden;
height: 50px;

Looks like您可能还需要table-layout: fixed。