Css 绝对位置在大小不固定的列表项上的div

嘿，伙计们，我正在尝试制作一个绝对定位的div，就像一个覆盖层，它扩展到与ul中列表项相同的宽度，其中列表项是流动的，我的意思是百分比。 我试过了，但白色的覆盖div似乎超过了列表项的大小，并扩展到了整个浏览器。 你能帮忙吗 这是小提琴

    .overlay
    {
        z-index: 3;


        position:absolute;
        height: 100px;
        width:100%;
        margin-top:0px;
        background-color: #fff;

    }

我想让叠加div与LI块的大小相同。 谢谢

---

请看我上面的小提琴。谢谢。

您只需将

li

设置为相对父项，即可定位

绝对

一个：

ul li {
  position:relative;
}

---

演示只需添加一个相对于ul li的位置