Css 使包装div重叠两个更宽的div

我正在尝试构建一个布局，在这个布局中，我在后台有两个div，它们跨越了页面的100%，然后是一个较小的全高包装div，用于位于页面中心的内容。我遇到的问题是，我可以让包装器正确地放置在顶部div的顶部；我无法让它在底部分区上正确运行。下面是一个示例：

html，
身体{
身高：100%；
边距：0！重要；
填充：0！重要；
}
.索引横幅{
背景#265f7a；
身高：60%；
宽度：100%；
}
.包装纸{
背景：#444；
身高：200%；
保证金：0自动；
位置：相对位置；
前-60%；
左：0；
右：0；
宽度：50%；
}
.页脚背景{
背景：#888；
高度：250px；
位置：相对位置；
前-85%；
左：0；
右：0；
宽度：100%；
z指数：-1；
}

---

我不理解“我无法让它在底部div上正确运行”这句话。从代码片段的外观来看，包装器也位于底部div的顶部，与您所说的顶部div相同；我打开了Chrome和Edge，它们看起来都应该如此。因此，这个问题似乎一直存在于firefox和firefox开发者身上。