Html 如何使表格单元格大小固定，而不考虑其内容

我有一个包含动态内容的表，因此每行的高度都是不同的-我想要的是固定表的高度，而不考虑内容。内容可以是任意长度，也可以有图像

我在CSS中尝试了以下内容：

table {
  border-collapse: collapse;
}
table td {
  border: 1px solid #ccc;
  padding: 4px;
}
table td:nth-child(2n+2) {
  width: 200px;
}
table td:last-child {
  width: 100px;
}
table tr {
  height: 80px;
  display: block;
  overflow: auto;
  background-color: red;
  border: 2px solid #ccc;
}

<table>
  <tr>
    <td>content1</td>
    <td>content 2</td>
    <td>content 3</td>
  </tr>
  <tr>
    <td>content1</td>
    <td>Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum.</td>
    <td></td>
  </tr>
  <tr>
    <td>content1</td>
    <td></td>
    <td>content 3</td>
  </tr>
</table>

表格{
边界塌陷：塌陷；
}
表td{
边框：1px实心#ccc；
填充：4px；
}
表td:n个孩子（2n+2）{
宽度：200px；
}
表td：最后一个孩子{
宽度：100px；
}
表tr{
高度：80px；
显示：块；
溢出：自动；
背景色：红色；
边框：2个实心#ccc；
}
内容1
内容2
内容3
内容1
乱数假文。乱数假文。乱数假文。乱数假文。乱数假文。乱数假文。乱数假文。乱数假文。
内容1
内容3

---

它工作得很好，但是当任何一个细胞中都没有内容物，或者如果内容物减少了一个细胞，它就会崩溃。以下是您可以使用的类似（）的内容：

---

使用支持

内联块的浏览器。（尽管我不确定这是否是一个好的解决方案。）
我没有看到这种“折叠”：——这会保持表格高度，即使没有任何单元格包含任何内容。然而，在不同的浏览器上它是不同的。在IE上，宽度折叠，但高度不折叠。在Firefox和Chrome上，无论是否有内容，宽度和高度都是相同的。这就是你想要的吗？要垂直拉伸列？@Sófka，我希望固定大小（高度和宽度）的每一行以及溢出内容不显示或不使用滚动显示and@BCT我认为表格单元格不能这样做，必须更改它们的显示类型或使用其他元素。
table td
{
    width: 60px;
    height: 60px;
    display: inline-block;
    overflow: auto;
}​