Home CSS Space Change The Spacing Between Lines
Search MS Office A-Z   |   Search Web Pages/ Design A-Z

Change The Spacing Between Lines

Use the line-height property in CSS to do so.

Browsers by default will create a certain amount of space between lines to ensure that the text is easily readable. For example, for 12-point type, a browser will place about 1 point of vertical space between lines. The space between lines of text is called the leading, a term loosely inherited from print publishing.

Line-height uses the standard CSS units of measurement, just like letter-spacing. You can designate text to have 26 points of leading like this:

<STYLE TYPE=”text/css”>
<!--
.twentysixpoint {line-height: 26pt;}
-->
</STYLE>
<P class=”twentysixpoint”>The text in this paragraph would have 26 points of leading.</P>


Relative measurements are best with line-height, however, because they will work with any size of type. For example, you can create text with the word processor equivalent of 1.5 lines like this:

.oneandhalf {line-height: 1.5em;}

<P class=”oneandhalf”>The text lines in this paragraph would have 1.5 lines of spacing regardless of font size. </P>