why my anchor padding does not work on webkit browsers?

Question

I have a navigation using anchor tags.

It's pretty basic, before of each section, I use

<a id="myid" class="anchor"></a> 

and link it to my main nav.

In the css, i have:

.anchor {padding-top: 45px;}

To prevent my sticky nav to overlap each section (my nav is 45px height).

My problem : though it's working fine on FF, Chrome and Safari seems to be ignoring the padding-top I set.

Sorry if this is a basic/newbe question, but I could not find the answer.

Thanks for your help!

Answer 1

Add display:inline-block to your .anchor CSS.

Demo