Css 在表格行的顶部而不是下方溢出

我遇到了这样一种情况，

div

从

td

溢出。问题是，它不知何故在它下面的内容下面流动，这使得一切都难以辨认。我尝试使用

z-index

，但没有效果。请参见我的

td.big { 
    overflow-y:visible;
}
div.clipper { 
    max-height: 5em; 
    overflow-y: hidden;
}
div.clipper:hover {
    overflow-y: visible;
}
tr:hover,
div.clipper:hover .backing {
    background: lightblue;
    z-index: 1;
}

table, tr, td { 
    z-index: 0;
}

---

我知道从技术上讲，

td

根本不应该有

溢出。我真正的目标是防止某些单元格的内容超过某个高度，然后在悬停状态下显示该内容。是否有一个CSS唯一的解决方案，或者我必须完成整个
$.clone（）
工作？
添加
最大高度：继承到。裁剪器：悬停

div.clipper:hover {
    overflow-y: visible;
    max-height: inherit;
}

默认情况下，z索引不起作用。它仅适用于相对、绝对或固定定位元素。
将
位置：相对
添加到指定z索引的css部分时，它会起作用。
最大高度：无也可以。我想我应该指定我不希望行改变高度。