Html 导航菜单点击滚动问题？

当我点击标题导航菜单时，它会滚动到相应的分区，但有些部分隐藏在粘性标题后面。如何用css解决这个问题

下面是我的小提琴链接

      `https://jsfiddle.net/6t8d1Lne/1/

---

例如，在所有部分添加与页眉高度相等的额外填充，并在负边距中减去额外填充

.section-f {
        background: #75D5A7;
        color: #fff;
        font-weight: 350;
        padding: 150px /*assunming your header height is 100px so I add 100px in 50px padding*/;
        margin-top: -100px; /*extra padding removed*/
        font-family: Roboto;
    }

---

请将代码的相关部分直接放在问题a部分、c部分、e部分有效，但f部分无效。背景色将添加到上一节i，e（第e节）