Search code examples
htmlpaddingcss

Line-Height VS Padding in Nav (Correct Method)

I am just getting back into coding and I would like to know what is the best method for adding heigh to my btn.

Here is the code -

Padding method

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

Line-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; 
}
Solution

  • I personally use padding as it gives me more control across browsers, as line height can vary on which font you are using, along with what fonts are installed/not installed on the clients' browser.