Html 如何将右侧容器设置为在其中滚动'；他自己的地方

这里是到的链接。我想要正确的容器滚动到位。我该怎么做？我尝试将

position:fixed

添加到右列，但这会破坏布局。现在溢出总是滚动到顶部。。基本上，我想

insta-shop-grid

在容器内部滚动。

我将其编辑为内联样式

看看它是否有效。将它们添加到类中

<div class="directory-container container" style="
max-height: 400px;
z-index: 1111111;
overflow: scroll;width: 100%;
margin-top: 361px;

">

并添加

---

但这个网站确实需要一些反应灵敏的设计。我使用400px和360作为边距，因为填充已经存在不过我还是希望这能起作用，在主要内容中添加

z-index:-1

，防止其在横幅上方滚动

见简化版

更新：

从@Anobik窃取，我修改了我的示例，删除了

z-index

，并在主要内容周围添加了

fixed

包装

HTML:

---

我不完全理解你的问题。如果你想避免横幅被文本溢出，你可以在横幅

div

中添加Z-index…我不想将横幅的Z-index添加到1，因为它看起来仍然很奇怪。我希望“店铺目录”保持不变，滚动条位于insta SHOP网格内？但要滚动div，您必须删除父目录的滚动条。您不能只向下拖动唯一的主体滚动条

<div class="banner">Banner</div>
<div class="nav">Navigation</div>
<div class="container">
    <div class="content">Main content</div>
</div>

.container {
    position: fixed;
    top: 60px;
    left: 125px;
    width: 75%;
    height: 400px;
    overflow: scroll;
}