表格单元格中绝对定位的伪元素未覆盖IE9 / 10中的父级

Question

我有一个嵌套的div设置，显示为table和table-cell，其中每个单元格都有一个绝对定位的:before元素，该元素覆盖了整个单元格。 除IE9、10和11中的before元素仅覆盖单元格的内容部分之外，此方法在所有地方都可以正常使用。

 div.wrap { display: table; } div.wrap > div { background: green; display: table-cell; position: relative; } div.wrap > div:before { background: red; display: block; content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0; } div.wrap > div > * { position: relative; /* render on top of overlay */ } 

 <div class="wrap"> <div> <h2> Content number 1 </h2> </div> <div> <h2> Content number 2 </h2> <p> With more content </p> </div> </div> 

有人知道这可以解决吗？

Answer 1

我最终解决的方法是简单地给:before元素一个可笑的min-height （在我的情况下为2000px，但取决于您的用例）以及overflow: hidden在表格单元中。