Sentence / Word / Letter Spacing

[robindean]

How do I make every sentence in a paragraph 100% width of the container div?

I want for my paragraphs and other sentences to all be a fixed, squared off width.

So that ...

Hi, this is a sentence.

is as wide as ...

Hi, this is sentences is slightly longer.

Further more, is there a way to cleanly balance the shift in word-spacing vs. letter spacing?

[NogDog]

text-align: justify;

[Major Payne]

You also can control word and letter spacing if needed:

p.spread { word-spacing: 0.5em; }

<p class="spread">The spaces between words in this paragraph are increased by 0.5em.</p>

p.spacious { letter-spacing: 0.25em; }

Use with caution. Especially for other languages.

**************

<p class="spacious">The letters in this paragraph are spread out somewhat.</p>

To set letter-spacing that's in proportion to font size, you must set it explicitly.

Ron

[WebJoel]

don't forget:

p {text-indent:value; line-height:value; margin:value}

whereby text-indent is self-explainatory, "line-height" is the height between 'lines of sentence' in the paragraph, and "margin" is the distance between seperated paragraphs.

line-height, probably best valued at "em" (1.1em, 1.2m, 1.3em, etc..)
margin, most likely best at "px" (6px 0 6px 0, etc)

A first-line pseudo :

<style type="text/css">
p:first-line {color: blue;font-variant: small-caps}
</style>

makes the FIRST line of a multi-line paragraph,
in this case, be the color "blue" or whatever you want.

and first-letter pseudo :

p:first-letter {color:red; font-size:xx-large}

Makes the first letter, HUGE (and red, in this case)

...you can have a LOT of fun with these.

[robindean]

Cool! Thanks!