在溢出内为DIV创建叠加：隐藏的DIV，不带剪切

Question

大家好。我希望能够在容器DIV中突出显示具有溢出的div：隐藏的设置（更改这不是一个选项）。我正在使用CSS'outline'和'box-shadow'属性来执行此操作。问题是，当DIV是外部div的完整大小时，您无法看到它被选中，因为轮廓（不出所料）被剪切到外部div。此外，如果内部div与其中一条边缘相对，则会出现问题。

附加图像显示div的布局，红色是外部div，紫色是“轮廓”，黑色是我要突出显示的DIV - 在该示例中，左侧的紫色突出显示被剪切。

所以问题是，是否有一种方法（JavaScript和jQuery很好）将黑色div与另一个div重叠，以便（a）覆盖div不会被剪切到外部div，以及（b）当黑色div移动或调整大小，叠加层移动/调整大小？

编辑：看起来这与我描述的方式在HTML / CSS中是不可能的。

Answer 1

将黑色div设置为“positon：relative”。然后将轮廓放入该div，并将其设置为“position：absolute”。有了top，left，with和height，你就可以把它“放在”黑色div上。

编辑：

Sry，黑色div也必须绝对位置。工作示例见这里： http://jsfiddle.net/t94FV/

Answer 2

也许你可以使用百分比的边距。

Answer 3

诀窍在于只有相对位置的父级div。 position:relative div没有overflow:hidden个孩子。只有父母！

<div class="trick-container" style="position:relative">
    <div class="overflow-hidden" style="overflow:hidden">
        <div class="no-relative-position-1">
            <div class="no-relative-position-2">
                <div class="no-relative-position-N">
                    <div class="position-absolute" style="position:absolute"></div>
                </div>
            </div>
        </div>
    </div>
</div>