Html TD元件内部元件高度

我有一个问题，我有TD元素内部的元素，当我将元素高度设置为100%时，它不会填充整个TD单元的高度。如果内部元素的内容具有不同的高度，是否可以在内部元素中填充整个TD高度

HTML

<table>
<tr>
    <td>
        <div>
            1<br/>
        </div>
    </td>
    <td>
        <div>
            2<br/><br/><br/>
        </div>
    </td>
</tr>
</table>

例如，请参见以下JSFIDLE：

---

您需要设置tr的高度，然后按像素设置元素的高度以匹配查看我更新的JSFIDLE

您需要设置tr的高度，然后按像素设置元素的高度以匹配查看我更新的JSFIDLE

这在css中是不可能的，因为表格单元格高度是基于其内容的。div的高度基于其父级的高度，在本例中是表单元格的高度。因此，如果只有一行，那么该行的高度就是表单元格的高度，也就是其中div的高度

---

请看这里为什么表格单元格中的div是个坏主意：。

这在css中是不可能的，因为表格单元格的高度是基于其内容的。div的高度基于其父级的高度，在本例中是表单元格的高度。因此，如果只有一行，那么该行的高度就是表单元格的高度，也就是其中div的高度

---

请看一下为什么表格单元格中的div是个坏主意：。

如果您不能在

td

或

tr

上设置固定高度（正如您在对其中一个答案的评论中提到的），恐怕唯一的方法是Javascript：

---

（我在本例中使用了jQuery）

如果您不能在

td

或

tr

上设置固定高度（正如您在对其中一个答案的评论中提到的），恐怕唯一的方法是Javascript：

---

（我在本例中使用了jQuery）

是的，这是可能的，但您的示例不起作用，因为您将

高度：100%

设置为另一个元素（td）中的div，该元素的高度未指定

---

因此，只需为td元素设置一个高度，或者通过js计算一个单元格的高度，然后将该高度应用于div

是的，这是可能的，但您的示例不起作用，因为您将

高度：100%

设置为另一个未指定高度的元素（td）内的div

---

因此，只需设置td元素的高度或通过js计算单元格的高度，然后将该高度应用于div

如果我无法设置TR height，那么在没有JavaScript的情况下是不可能实现的？请参阅此更新的JSFIDLE，您可以按像素为div元素设置高度，而不是TR如果我无法设置TR height，如果没有JavaScript，那么就不可能实现。请参阅更新的JSFIDLE，您为div元素设置了像素高度，而不是TRTables用于制表数据。检查您的情况并确定是否需要表格。表格用于将数据制成表格。检查您的情况并确定是否需要表格。

table {
 width: 200px;
 position: relative; 
 }
 table tr td {
 background-color: blue;
 width: 47%;
 position: relative;
 margin: 10px 1%;
 border: 1px solid #eee;
 }
 table tr td div {
 height: 100%;
 background-color: red;
 }