Line-Height VS Padding in Nav (correct method)

I will just go back to coding, and I would like to know what is the best method for adding heigh to my btn.

Here is the code -

Filling method

.nav-main li a { display: block; padding: 70px 10px 70px 10px; color: #6CF784; border-bottom: 10px solid white; text-decoration: none; } 

Linear height method

 .nav-main li a { display: block; padding: 0 10px 0 10px; line-height: 150px; color: #6CF784; border-bottom: 10px solid white; text-decoration: none; } 
+8
html css padding
source share
2 answers

I personally use padding as it gives me more control over browsers, as the line height can vary depending on which font you are using, as well as which fonts are installed / not installed in the client browser.

+7
source share

I like to use line-height because it correctly positions the source line so that the text appears in the middle of the element (whereas with filling it can be off-center in one or another format based on the font)

Of course, this depends on whether you use the pixel value for line-height (as you do in your question) - using a numerical value like 1.5 can give different results depending on the font.

+12
source share

All Articles