'Line Spacing for Individual Fonts

I'm using custom fonts in WordPress. I do it by defining font family. I'm having problem if line spacing with One if my fonts. If I use line-height code in my custom css I'd theme, it's applied to all the fonts which isn't required. I just want to change line spacing of problematic font. Can we define line spacing for a font while defining its font family?

Best Regards



Solution 1:[1]

You can implement font-family with line-height in one class. I mean something like this:

HTML:

 <div class="lato-font">Text</div>
 <div class="monospace-font">Text</div>

CSS:

.lato-font {
    font-family: Lato, sans-serif;
    line-height: 1.6;
}
.monospace-font {
    font-family: monospace, serif;
    line-height: 1.6;
}

In this case you can set custom line-height for each font.

Solution 2:[2]

You'll have to define line-height for each element or class that uses the custom font.

h1,h2,h3,h4,h5,h6,.lead-text,.some-other-class,li {
  font-family: ######;
  line-height: 20px;
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Alex
Solution 2 Kenny Saunders