I am newbie with html css and here is my problem.
I want to code a page as this page https://www.w3schools.com/w3css/tryw3css_templates_band.htm#band
I want to see the button's information, and here is what I got

As you can see in this picture, I see the button contact's padding is 12px 24px. But when I code this button, when I set the padding like this
#nav li a {
text-decoration: none;
line-height: 46px;
padding: 12px 24px;
}
The button became like this picture 
They said to me that I must set the padding like this
#nav li a {
text-decoration: none;
line-height: 46px;
padding: 0px 24px;
}
And here is what I got
Maybe it is ok when set padding 0px 24px.
I am very confusing because why I must set padding different with the padding it show in the page ?
Could you please explain this problem for me ? Thank you very much for your time.
