1

我有一个带有 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 需要有更短的高度。

在此处输入图像描述

4

2 回答 2

1

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

于 2012-09-07T17:37:03.430 回答
0

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

overflow: hidden;
height: 50px;

看起来你可能还需要table-layout: fixed.

于 2012-09-07T17:38:16.697 回答