Html CSS显示：表格单元格，设置高度和溢出：隐藏，不'；不行？

如果某个元素的子元素内容太大，但它在

display:table cell

元素中不起作用，我想剪辑该元素。下面是一个关于JSFIDLE的示例：

.table{
显示：表格；
表布局：固定；
宽度：100%；
高度：200px；
}
.细胞{
显示：表格单元格；
垂直对齐：顶部；
位置：相对位置；
高度：200px；
溢出：隐藏；
}
.集装箱{
身高：100%；
背景色：红色；
}
.集装箱img{
显示：块；
}

---

更改css显示类型

.table{
    display:block;
    width: 100%;
    height:200px;
}
.cell{
  display:block;
  vertical-align: top;
  position: relative;
  height:200px;
  overflow:hidden;
}
.container{
  height:100%;
  background-color:red;
}
.container img{
  display:block;
}

---

要使其正常工作，我们必须使用position:relative表示表格，position:absolute表示表格单元格项。同样在您的代码中，我删除了容器的高度：100%，这是没有用的。这是预览和预览

.table{
显示：表格；
表布局：固定；
宽度：100%；
高度：200px；
位置：相对位置；
}
.细胞{
显示：表格单元格；
垂直对齐：顶部；
位置：绝对位置；
高度：200px；
宽度：100%；
溢出y：滚动；
溢出x：隐藏；
}
.集装箱{
背景色：红色；
}
.集装箱img{
显示：块；
}

无法将高度应用于

显示：表格单元格

容器。因此，将高度应用于

.container

元素。比如

.container{height:200px}

。我知道如何解决这个问题，我不知道为什么要设置高度，设置溢出，但这不起作用。。。