Search code examples
htmlanchorcenter

HTML: Making a link lead to the anchor centered in the middle of the page

I have a link to an anchor on my html page. When the link is clicked it causes the page to scroll to the anchor so that the anchor is at the very top of the visible part of the page. How can I make the page scroll so that the anchor will be in the middle of the page?

Solution

  • There is no straight way of doing this in pure html\css. It is possible though using js, by getting the element's top location and setting the page's top position to that element's position minus half of the page's height.