0👍
Try adding a separate element before the content you are scrolling to and add 60px
gap there.
HTML
will be like
<span class="target" id="who_we_are"></span>
<h1>Who We Are</h1>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
<span class="target" id="join_us"></span>
<h1>Join Us</h1>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
And css will be like
.target{
display: block;
height: 60px;
margin-top: -60px;
visibility: hidden;
}
Source:stackexchange.com