Background

Months ago I was looking through someone’s code and saw something that I knew could make my HTML a lot cleaner.

 

HTML

Original Code

Image

Code

<p style="padding-left: 40px;">Jack and Jill went up the hill</p>
<p style="padding-left: 40px;">To fetch a pail of water</p>
<p style="padding-left: 40px;">Jack fell down and broke his crown</p>
<p style="padding-left: 40px;">And Jill came tumbling after</p>

Revised Code

Image

Code

<div class='tab'>

Jack and Jill went up the hill
To fetch a pail of water
Jack fell down and broke his crown
And Jill came tumbling after

</div>

Summary

Quick Summary.

Using WordPress editor, when you use the tab key you will get HTML code with quite a bit of paragraph padded left.

Using the tab key numerous times, you will get the desired effect.

But, that desired effect creates a block of HTML code that is a bit more work to keep up with.

You are a bit better served if you plan ahead and use CSS.

Specifically, using the div tag and specifying tab as its class.