Html 浮动div重叠不正确

在下面的代码中，我希望

#nav

div与

#content

div重叠。尽管

#nav

具有更高的z索引值，但它仍然被

#content

重叠

小提琴：

HTML:

非常简单的代码，但我不明白我做错了什么。任何帮助都将不胜感激

注意：我在没有外部div（）的情况下尝试了相同的方法。还是一样的问题（

将此添加到css中

#above{position:absolute;}

将此添加到css中

#above{position:absolute;}

---

z-index

仅适用于

绝对的
定位元素。当浏览器忽略
z-index
的值时，它将按照元素在html代码中的顺序呈现它。由于
#content
在代码中晚于
#nav
，
#content
将显示在
#nav>上
 
z-index
仅适用于
绝对
定位元素。由于浏览器忽略了
z-index
的值，它将按照元素在html代码中的顺序进行渲染。由于
#content
在代码中晚于
#nav
，
#content
将显示在
#nav
上。
像这样？像这样？z-index也适用于相对和固定，只有static不模拟z-index属性；）。z-index也适用于相对和固定，只有static不模拟z-index属性；）。
#above{position:absolute;}