Tagged: in-page anchor
- This topic has 2 replies, 2 voices, and was last updated 3 years, 3 months ago by
Theme Horse Support Team.
-
AuthorPosts
-
May 18, 2021 at 12:11 am #88646
David Humphreys
ParticipantHi 🙂
I have some in-page anchors that are linked to from elsewhere in the page.
When you click on the link, it goes past the anchor point. As an example, please look at this link, I’ve linked the first word in the article to an anchor point in the paragraph that starts “Unlike fledglings, if a nestling is spotted outside their nest …” – As you will see, it is as if the menu bar at the top of the page is covering the start of the anchor point.Any suggestion on how to fix this?
May 19, 2021 at 11:29 pm #88701David Humphreys
Participantbump
May 23, 2021 at 3:45 pm #88762Theme Horse Support Team
KeymasterHi David Humphreys,
Yes the Linked section will goes at the top of the screen, like you said the linked section is override by the Navbar. For the solution. If you are familiar with HTML language then you can follow the below process.
Step 1- For the Target Section add
class="target-parent"
and shift the linked id to inside target-parent element with<span id="(link)" class="linked-target"></span>
.In your case the Code should look like this
<p class="target-parent"> <span id="unlike" class="linked-target"></span> Unlike fledglings, if a nestling ............ </p>
Step-2. Go to ‘Appearance > Customize > Additional CSS’ then paste the below Custom CSS code.
.target-parent { position: relative; } .linked-target { position: absolute; top: -150px; left: 0; }
Here (top: -150px) property is determined for top spacing so you can update the top property to any according as you desired.
Now you can follow only Step 1 process to apply on others pages links as well.
Thanks
-
AuthorPosts
- You must be logged in to reply to this topic.