如何用css重叠两个div

Question

我正在尝试构建一个页面，其中有两个方向相反的侧边栏。我正在使用从 evanto 购买的 metronic 管理主题，即使页面正在滚动并且页面内容位于该侧边栏下方，我也希望它能够得到修复。我已将这两个菜单放在一个类为page-container 的div 中，其中我有另一个div 用于名为page-content-wrapper 的页面内容。

这里是my problem的链接

我尝试在 editor.css 中使用以下 css：

body {
    color: #333333;
    font-family: "Open Sans", sans-serif;
    padding: 0px !important;
    margin: 0px !important;
    font-size: 13px;
    direction: ltr;
}

body {
    background: #e9ecf3;
}

.page-header-fixed {
    margin: 0px;
    padding: 20px 20px 0 20px;
    position: relative;
    z-index: 2;
}

.page-container {
    margin-top: 75px;
    padding: 0px;
    z-index: 2;
}

.page-content-wrapper {
    z-index: 3;
}

我尝试使用absolute position，但随着侧边栏的倒塌，它变得更加混乱。我也尝试输入z-index，但它没有帮助。

内容也在侧边栏显示。

请帮忙。

Answer 1

如果您想在滚动时固定元素相对于窗口的位置，请在该特定元素上使用position: fixed;。