Line height CSS

The following CSS will create space between lines:

p{
    line-height: 2.7;
}

You can use any numbers to specify the line-height depending on your font. But normally we use “1.7” and it also depends on the font families.

You can also specify the line-height with “px, em, cm, %” etc. For example:

p{
    line-height: 30px;
}
p{
    line-height: 2em;
}

Create Space Between Paragraphs

You have to use the margin property to create space between paragraphs. See the following example:

p{
    margin-bottom: 60px;
}

This code will create the bottom margin of the paragraphs by 60 pixels. If you need to create space both at the top & bottom of the paragraphs, then use the following CSS:

p{
    margin: 60px 0;
}

This CSS will create a 60-pixel margin both at the top & bottom of the paragraphs (zero to left & right).

In the same vein, you can also use padding to create space inside the box. For example: padding: 30px 15px. This will add 30 pixels of space to the top & bottom and 15px to the left & right.

If you use both margin & padding together, the element may receive more space than expected. For more information, see the CSS box model.

Build HTML CSS projects

Conclusion

This post is about line-height. However, I also discussed margin, padding & box model to give you a clear idea. If you have any questions, let me know.