透明物体出现

Question

我有几个display: inline-block

的div

<div style="width:48%;padding:3px;z-index:1;" class="main_block">
    Text :<br>
    <div style="width:100%;border:1px solid #f7f7f7;background-color:#f7f7f7;height:150px;overflow:visible;">
        <div style="width:100%;" id="main_contact_us">
            Looong text here
        </div>
    </div>
</div>

div是水平排列的，但有时我需要每组中的第二个div成为overflow: visible，当我在mouseover上执行此操作时，第3个div将显示在下面的任何div下面主要的divs组，透明！这意味着我可以看到它下面的任何文字，我无法为它设置背景颜色。有没有解决方案？

Example here

Answer 1

我将position:relative;添加到内部div中，一切正常