Can I get line spacing with CSS ?

liunx

Guest
Hi There, this is a pretty general question. I use Dreamweaver to create web pages, but I've not been using it too long. I'm getting fed up with the fact that you can only enter returns or line breaks, I would like more control over line spacing. I understand that CSS can do this, but do you introduce a set of new problems when you start using CSS. I really only want to change line spacing that's all.

Cheers, kennykOriginally posted by kennyk
I understand that CSS can do this, but do you introduce a set of new problems when you start using CSS. Introduce a new set of problems using CSS? Certainly not. CSS is meant to be used for layout. In the perfect world, our HTML would just markup our pages (it is, after all, Hypertext Markup Language), and we wouldn't need to use it for layout at all. I would recommend learning more about CSS (<!-- m --><a class="postlink" href="http://www.w3schools.com/css">http://www.w3schools.com/css</a><!-- m --> and <!-- m --><a class="postlink" href="http://www.w3.org/TR/CSS2/">http://www.w3.org/TR/CSS2/</a><!-- m -->) and start using it for layout. It helps keep your pages accessible and forward compatable.You can control line height/spacing by using the following code:


p {
line-height: 150%;
}


Every <p> tag will have a line height of 150% of it's parent element. This is the equivelant of 1.5 spacing in a word processor. You can also specify the line height in points (pt), pixels (px), or ems (em). Percentages are recommended though, as they are screen resolution independant.

If you only want a few random instances of a larger line height, do this:

In CSS:

.bigLineHeight {
line-height: 150%;
}


In HTML:


<p class="bigLineHeight">Blah blah blah blah.</p>

<div class="bigLineHeight">Blah blah blah blah blah.</div>


You can use the bigLineHeight class for any HTML tag that affects text.

The two links that Pyro posted above are excellent. W3schools.com is best for beginners as it's tutorial-based. The W3C specs are a bit harder to understand if you've never dealt with CSS before.
 
Back
Top