Tagged: in-page anchor
- This topic has 2 replies, 2 voices, and was last updated 3 years, 4 months ago by Theme Horse Support Team.
-
AuthorPosts
-
May 18, 2021 at 12:11 am #88646David HumphreysParticipant
Hi 🙂
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 HumphreysParticipantbump
May 23, 2021 at 3:45 pm #88762Theme Horse Support TeamKeymasterHi 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.