How to increase line height With CSS

0

Want to increase line height of your WordPress website, you can do this with CSS.

how-to-increase-line-height-css

There are times when we like to make changes to our website and one of the main area is the content area. After all every one is coming to your website just for that.

Text can be more appealing to viewers with right size and space between two lines. This space between two lines is what we call line height.

Line height of your website text is defined in the CSS file of the theme that is currently active on your website.

Even though theme creator have defined the line height, but it’s not necessary that you will like that too. This can be due to many reasons, for instance when we change the font type all the look of the text changes, so does beauty of old line height.

Now with the new font you have to adjust the line height to suit your blog design.

how-to-increase-line-height-with-css
How to Increase Line Height With CSS

Now to increase Line height with CSS on WordPress.

First you have to go Dashboard»Appearance»Editor you can even do that with Ftp client. Now you have to find .post p in your css file. Now you have to change or add some code to it.

This .post p is the code which controls the paragraph of the post. You just have to find this and make changes to the code, if you are not ableo tofind it then you can even create this code and add the bellow code to it.

[code].post p{
line-height: 1.5em;
}[/code]

This 1.5em is 1.5 times the default line height, You can change the number depending on the line height you want have between two lines 1em is the default height that came with your theme and you can increase it to 1.2, 1.8, 2.5 or any thing you like.

After editing the code you should save it, if you are using FTP then after saving you have to upload the file to the server.

Now you are done with this you can now see the results by visiting your website. You can make adjustment by changing the em value.

This is an easy way by which you can change the line height.

If you likes this post then there are more tutorials that you might be interested in. You can visit our tutorial section to learn more things about making your WordPress website better.

Further Read:

If you liked the post then please share it, and to ask a question or for starting a conversation use the comment section below.

You can follow us on twitter, facebook, Google+

Leave a Reply

Your email address will not be published. Required fields are marked *