下面是一个很长的解释，但这是有效沟通我试图解决的问题的唯一方法...
我（有点绝望，但完全不成功）试图不使用绝对定位来覆盖div。这种需要源于我通过Javascript在网站上放置的一个paypal购物车。购物车的自然位置是硬靠在网页的顶部空白处（而不是它包含的div，即**#wpPayPal**，或者这个div的 Package 器，#main）。
脚本的作者强烈建议不要自定义购物车的样式表，但是我发现他写的一个教程可以将购物车插入到占位符div中，并提供了有效的容器定位说明-我可以将购物车定位在站点顶部横幅部分的下方。
购物车的HTML表单和每个表单中的ul元素在购物车的样式表中都有高度要求，这会将页面的主要内容（由容器div**#imageWrapper** Package ）推到页面的底部太远而无法接受。
我试过将#imageWrapper放在#main之上，但没有成功。我试过将#imageWrapper绝对定位，但这会让页脚自由浮动。#imageWrapper的高度是可变的，因此我不想用高度来固定页脚，因为防止重叠的最小高度会将页脚向下推得太远，以至于网站的大部分内容都无法看到页脚。
我也试过从cart表单的CSS中提取position：relative，但是cart会立即浮回到网页的顶部。
然后我读取了一个article on，使用position：relative和z-index来覆盖div。在#main（包裹贝宝购物车的div）上加了-1，但是购物车消失了，也不确定它去了哪里，因为站点的breadcrumb nav（也是用#main包裹的）仍然在那里。
然后，我将main的z索引设置为0，并应用position：relative to #imageWrapper，z索引为100。购物车再次出现，但仍然按住#imageWrapper。
欢迎提出建议。我不是一个界面设计师，只是一个知道如何使用Google的人，所以提前感谢你清楚地阐明了你的解决方案：）另外，仅供参考，目前我将cart表单的最小高度要求设置为0，并将其中的UL元素设置为height：auto。由于cart中只有一个项目，这允许#imageWrapper在页面上移动到足够高的位置，以达到可接受的程度，但这不是一个可行的长期解决方案。
这是一个example page--要查看购物车，请使用主图片下方的下拉菜单添加一个项目。在它的展开状态下，您将看到#imageWrapper是如何与它相对的。
我已经包括了下面的部分违规HTML/CSS：

<div id="main">
    <div id="wpPayPal">
    </div><!--end wpPayPal-->
    <div id="breadcrumbs">
        <span class="B_crumbBox"><span class="B_firstCrumb"><a class="B_homeCrumb" href="/">home</a></span> &raquo;</span></span>
    </div> <!--end breadcrumbs -->
</div><!-- end Main -->

<div id="imageWrapper">
    <div id="imageInnerWrapper">
        <div id="featureImage">
            <div class="filename"><h1>~&nbsp;Bryce Canyon Sunrise | Bryce Canyon | Utah&nbsp;~</h1>
            </div><!--end filename-->

等等。

#main {
    display: inline;
    position: relative;
    z-index: 0;
}

#imageWrapper {
    clear: both;
    width: 840px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    z-index: 100;
}

#imageInnerWrapper {
    width: 840px;
    margin: 0 auto;
    padding: 0;
    position: relative;
    z-index: 100;
}

#featureImage {
    width: 840px;
    margin: 0 auto;
    padding: 0;  
}

#wpPayPal {
    overflow: hidden;
    float: right;
    margin-right: 100px;
    min-width: 365px;
    min-height: 20px;
}

/* Override the default Mini Cart styles */

#wpBody #PPMiniCart form {
    position: relative;
    right: auto;
    width: auto;
    min-height: 0;
}

#wpBody #PPMiniCart form ul {
    height: auto;
}