带有下拉菜单的固定标题，可移动内容答案

【问题标题】：Fixed header with dropdown menu which moves the content带有下拉菜单的固定标题，可移动内容
【发布时间】：2020-08-01 16:17:36
【问题描述】：

这是未修复时会发生的情况，这是我想要的行为，但我希望修复导航栏

修复后会发生以下情况：它不会移动内容（它在此下拉菜单后面）

// scss for the nav
.filterbar {
    position: fixed;
    top: 0;
    box-shadow: 0 0 15px black;
    width: 100%;
// for info section
.filters-info {
    margin-top: 110px;
    display: flex;
    justify-content: space-between;
}

如何解决这个问题？（margin-bottom 没有帮助）。我有两个想法： 1. 获取 toggleFilterbar 道具并基于此更改样式 2. 使导航位置绝对，然后将其更改为固定。但是，我想必须有一个更简单的 css 方法来解决这个问题

【问题讨论】：

标签： javascript html css reactjs sass

【解决方案1】：

给position:relative;给.filters-info

和

替换 margin-top: 110px; 为 top: 110px;

【讨论】：