How add padding-top to an ancre link?

css, html

Solution

I think what you're trying to do is cause the link, when clicked, to scroll the browser window to a few pixels above the target, instead of having the target flush with the top of the browser window.

You can check this article for several solutions http://css-tricks.com/hash-tag-links-padding/

The simplest solution, generally would appear to be to add in your css:

#myanchor{
  margin-top: -200px;
  padding-top: 200px;
}

Replacing 200px with whatever value you feel is appropriate. You may also wish to use a class to apply this, as I asume you won't just wish to use it on the one item :)

Problem

I would like add a `padding-top` to my `div` when I click on the link to the anchor : ``` <a href="#myAnchor">Go to my anchor</a> ... <div id="myAnchor"> ... </div> ``` The issues is that I want add the padding just when my link redirect me to the anchor. I don't want add `padding-top` in the html, I just don't want that my div is on the top of my page, I need a padding or margin top. Thank you.

Original source