I am facing an issue where the linked heading of a section on the same page is getting lost under the fixed navigation bar when scrolling down. This problem seems to only occur on desktop view as it works fine on mobile preview. Here is the code I am currently using:
<div class="content uk-width-1-2@l uk-width-1-1@m uk-width-1-1@s">
<span class="anchor" id="Overview"></span>
<h2>Overview</h2>
<p> As a very high-level summary:</p>
<ul>
<li>
Company has strong application, network and infrastructure-level
security controls in place to ensure your data is safely stored
and processed <br /><br />
</li>
<li>
Company serves multiple tenants from the same application codebase,
but uses effective isolation techniques to keep tenant data separate
<br /><br />
</li>
<li>
Privacy laws, which are broadly compatible with many other jurisdictions
(for example, we support the rights of access and rectification
for data subjects) <br/><br/>
</li>
<li>Company is hosted on AWS, in multiple regions, using VPC <br /><br /></li>
</ul>
<p>
You'll find more information on each of these points
in the detailed chapters documents below.
</p>
</div>
.anchor {
display: block;
height: 63px;
/* this is the height of your header */
margin-top: -63px;
/* this is again negative value of the height of your header */
visibility: hidden;
}
Seeking assistance in resolving this issue.