html - 用显示将项目覆盖在某物之上：table-cell 和 min-height

Question

使用display: table-cell时无法提供该元素position:relative。因此，为了用某些东西（例如半透明的 div）覆盖整个元素，您首先必须将内容包装在一个 div 中position:relative，然后将覆盖层放在那里。

但是，当我也在包装器上设置最小高度时，覆盖层不会延伸到整个高度，我似乎无法找到让包装器的内容高度感知的方法。是否仅使用 css 在具有 display:table-cell 和最小高度的 div 顶部有 100% 的高度覆盖？

<div style="table-row">
    <div style="table-cell; min-height: 100px">
        <div style="position: relative; height: 100%;"> // this refuses to extend to 100% height when the table row forces the cell height to grow
             <p> content </p>
             <div style="position:absolute; top:0;left:0;height:100%;width:100%"> // ... therefore so does this
             </div>
         </div>
    </div>
    <div style="table-cell; height: 150px"></div> // forces the entire row to grow in height
</div>