CSS：如何制作div块*而不是*在其父容器中占用空间

Question

如果我有2个div标签：

<div id="parentDiv">
   <div id="childDiv"><!-- other html --></div>
   <!-- parent div html -->
</div>

我希望<div id="childDiv">的内容与内容<!-- parent div html -->重叠。

原因（如果这对任何人来说都是错误的代码设计）： 我需要谷歌网站的黑客解决方法，我不能在侧边栏导航中添加自定义代码，只在主html空间，我想浮动一个没有空间的div，并相对将其放在侧栏上以绕过强制限制

我可以做任何事情，除非阻止childDiv占用其混乱的主页容器中的空间。

Answer 1

你可以给它一个绝对位置，并用边距导航它。

    #childDiv {
      position: absolute;
      margin-top: -100px;
      margin-left: -100px;
    }

Answer 2

如何简单

#childDiv {height:0; overflow:visible;}

但你可能希望它有背景颜色，嗯？ HM。

Answer 3

您必须将子块从流中取出。最好的方法是在position: absolute上div，在父position: relative上div。

Answer 4

#parentDiv {
    position: relative;
}
#childDiv {
    position:absolute;
    top:0;
    left:0;
    width:100%;
}

如果您需要碰撞内容，或重叠侧边栏“外部”的内容，您可以使用负边距来增加childDiv的宽度或向上移动（以覆盖不能填充的边距或边距）倍率）。

如果您需要让#childDiv覆盖整个#parentDiv，您可以使用一些JavaScript在childDiv上设置最小高度，然后添加彩色背景或其他内容来覆盖任何内容。

var parentHeight = jQuery('#parentDiv').height();
jQuery('#childDiv').css('min-height',parentHeight + 'px');