Html 如何将div置于其他div之上？

我试着把我的左半身和右半身放在我的中半身之上，但似乎不起作用。我认为用z指数将中体置于相对位置，将左右体置于绝对位置会有所帮助，但事实并非如此。所以我现在不知道。任何帮助都将不胜感激

.Header{
背景色：#中交；
宽度：计算（100%-16px）；
高度：100px；
边界半径：5px；
}
.中体{
背景色：#141414；
宽度：计算（100%-16px）；
高度：850px；
利润上限：3倍；
边界半径：5px；
位置：相对位置；
}
.页脚{
背景色：#中交；
宽度：计算（100%-16px）；
高度：50px；
边缘顶部：5px；
边界半径：5px；
}
#左体{
背景色：#f1f1；
宽度：计算（50%-16px）；
高度：425px；
浮动：左；
左边距：3倍；
位置：绝对位置；
z指数：1；
}
#右体{
背景色：#f1f1；
宽度：计算（50%-16px）；
高度：425px；
浮动：对；
位置：绝对位置；
z指数：1；
}

---

使用

位置：固定而不是
位置：绝对
我已更改

float:left;  ->  left:0;
float:right;  ->  right:0;

及

最终css:


.Header{
背景色：#中交；
宽度：计算（100%-16px）；
高度：100px；
边界半径：5px；
}
.中体{
背景色：#141414；
宽度：计算（100%-16px）；
高度：850px；
利润上限：3倍；
边界半径：5px；
位置：相对位置；
}
.页脚{
背景色：#中交；
宽度：计算（100%-16px）；
高度：50px；
边缘顶部：5px；
边界半径：5px；
}
#左体{
背景色：#f1f1；
宽度：50%；
高度：425px；
左：0；
左边距：3倍；
位置：绝对位置；
z指数：9999；
}
#右体{
背景色：#f1f1；
宽度：50%；
高度：425px；
右：0；
位置：绝对位置；
z指数：9999；
}

看起来像一个显示器：flex；工作：）如果你指的是在我还不熟悉这一点之前的顶级。我应该把元素放在哪里？这不是元素，这是显示。但是这里不应该使用绝对值，除非你们想让元素在同一个区域相互重叠，你们能澄清一下（我的英语不是很好；））好吧，我想让我的左半身和右半身并排在我的中身里面。你们说的“左半身和右半身在我的中身之上”是什么意思？非常感谢你们。工作完美！
width:calc(50%-16px);  ->   width:50%;