我希望将页面精确滚动到该部分的顶部。我的意思是计算导航栏的高度以及该部分的开始位置应显示在导航栏的下方。但是在我的情况下，这些部分位于导航后面。 （顺便说一句，我正在通过id和href滚动到div，我想我应该写一些js代码）。
HTML：
<div class="right-nav">
<ul>
<li><a data-scroll="header" href="#header-section" class="active-nav">Ana səhifə</a></li>
<li><a data-scroll="about" href="#about-section">Layihə</a></li>
<li><a data-scroll="terms" href="#terms-section">Qəbul şərtləri</a></li>
<li><a data-scroll="attendants" href="#attendants-section">İştirakçılar</a></li>
<li><a data-scroll="most-asked" href="#most-asked-section">Sual-cavab</a></li>
<li><a data-scroll="contact" href="#contact-section">Əlaqə</a></li>
<li><button class="apply-button " id="popup-opener">Müraciət et</button></li>
</ul>
</div>
<section id="about-section" data-anchor="about">
<div class="left-side-about">
<img src="img/undraw-developer-activity.svg" alt="Image not found :/">
</div>
<div class="right-side-about">
<span>CHALLENGERS CLUB</span>
<h2>Bizim Haqqımızda</h2>
<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, when an unknown printer took a galley of type
and scrambled it to make a type specimen book. It has survived not only five centuries, but also the
leap into electronic typesetting, remaining essentially unchanged.</p>
</div>
</section>
CSS：
#about-section {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 80px 0px;
}
.pc-nav {
position: fixed;
left: 0;
top: 0;
right: 0;
z-index: 1;
padding: 14px 0px;
}