Justification of text in HTML

Is there way to force the justification of text using CSS to one line? For example:

I want to justify this text
like                   this
ButIdon'tmindifitsquashesit

I don't need people to tell me that it's a bad idea to justify text in web pages (I have a manual line spacing and hyphenation algorithm to assist), but I'm just wondering if there's a solution, CSS or JavaScript, to handle this.

Sorry, wasn't very clear with my question: Each line is in a separate div element, e.g.:

<div>I want to justify this text</div>
<div>like this</div>
<div>But I don't mind if it squashes it</div>

I know about text-align: justify but it doesn't solve my problem — it justifies ac开发者_Go百科cording to how the browser wants to, not by the each line I have. This may result in inappropriate line breaking or falling short of the right edge.

You cannot justify single lines of text.

However, you can hack together something that may work for you.

div{width:300px; 
    border:1px solid red;
    text-align:justify; text-justify: newspaper;
}

div:after{
    content: "               ";
    line-height: 0;
    visibility: hidden;
}

http://jsfiddle.net/jasongennaro/zX9x5/1/

This only works if you are okay with an extra blank line under the content.

borders just for example to see spacing, etc.

H/T to @thirtydot for the idea: Justify the last line of a div?

You might try

text-align: justify;

in your CSS :-)