Set the Line Spacing
By Stephen Bucaro
You might set the line spacing different than the default setting when you need
the text to fill a predefined area. Use the line-height property to set
the space between lines. You can increase or decrease the line spacing.
Shown below is the default spacing between lines.
This is the default spacing between lines.
This is the default spacing between lines.
This is the default spacing between lines.
Shown below is the Line-height set to 8 pixels. Obviously this is a
bit to small, but it's just an example.
<p style="line-height:8px;">
This is decreased spacing between lines.<br />
This is decreased spacing between lines.<br />
This is decreased spacing between lines.</p>
This is decreased spacing between lines.
This is decreased spacing between lines.
This is decreased spacing between lines.
Shown below is the Line-height set to 30 pixels. This might be a bit
to much line spacing.
<p style="line-height:30px;">
This is increased spacing between lines.<br />
This is increased spacing between lines.<br />
This is increased spacing between lines.</p>
This is increased spacing between lines.
This is increased spacing between lines.
This is increased spacing between lines.
You might set the line spacing different than the default setting when you need
the text to fill a predefined area. But since you may not know the default
spacing between lines, you may need to experiment with different values.
More CSS Quick Reference: • Set the Font Boldness • Set the Text Case • Set the Type of Bullet Used in List • Descendant Selector • How to Use a CSS ID Selector • Set the Border Style • Define CSS Rollover Effects • Set List Bullets Position • position:absolute • Vertical Align an Element
|