"Justify"-like effect within text

We all know that text-align: justify; is supposed to justify the
block's text across the box. I have a friend, however, who wants to
take that further. A visual example, because it's 2:30 AM and I don't
want to try to describe it:

MARGIN| S O M E T E X T |MARGIN

Where "SOME TEXT" is a heading, presumably, and the spacing between
letters works out such that the contents space to fit the whole box,
which stretches and shrinks with the browser or page.

Ideally we'd like to avoid putting each letter in a div, but if that's
the only way...

Owen

re: "Justify"-like effect within text

Owen Jacobson wrote on 02 sep 2003 in
comp.infosystems.www.authoring.stylesheets:
[color=blue]
> We all know that text-align: justify; is supposed to justify the
> block's text across the box. I have a friend, however, who wants to
> take that further. A visual example, because it's 2:30 AM and I don't
> want to try to describe it:
>
> MARGIN| S O M E T E X T |MARGIN
>
> Where "SOME TEXT" is a heading, presumably, and the spacing between
> letters works out such that the contents space to fit the whole box,
> which stretches and shrinks with the browser or page.
>
> Ideally we'd like to avoid putting each letter in a div, but if that's
> the only way...
>[/color]

<style>
span{width:400px;border:green solid 1px;
letter-spacing:33px;text-align:center;}
</style>

This is
<span>SOME TEXT</span>
justified in IE6

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

re: "Justify"-like effect within text

"Owen Jacobson" <ojacobson.usenet@mx-deus.net> wrote:
[color=blue]
> We all know that text-align: justify; is supposed to justify the
> block's text across the box.[/color]

And justification generally makes things worse, see
http://www.cs.tut.fi/~jkorpela/www/justify.html
[color=blue]
> I have a friend, however, who wants to
> take that further. - -
> MARGIN| S O M E T E X T |MARGIN[/color]

I don't think there's a way to do that in "standard" CSS, but if your
friend is happy with something that works on IE 6, you could use

<div class="special">Some text</div>

with

..special { text-align: justify;
text-justify: distribute;
text-align-last: justify;
text-transform: uppercase;
margin: 0 3em; }

--
Yucca, http://www.cs.tut.fi/~jkorpela/

re: "Justify"-like effect within text

Owen Jacobson wrote on 02 sep 2003 in
comp.infosystems.www.authoring.stylesheets:
[color=blue]
> Evertjan. wrote:
>[color=green]
>> <style>
>> span{width:400px;border:green solid 1px;[/color]
> ^^^^^^^^^^^^
>
> No good. The box in question has to change size with the page.
> Letter-spacing seems to behave a little weirdly with percentage lengths
> in that each letter is frequently (non-monospaced) font not the same
> width on its own.[/color]

I think it is very good, not perfect, but without scripting, css will not
help you to all your specs.

Perhaps change the specs ?


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

re: "Justify"-like effect within text

Jukka K. Korpela wrote on 02 sep 2003 in
comp.infosystems.www.authoring.stylesheets:
[color=blue]
> I don't think there's a way to do that in "standard" CSS, but if your
> friend is happy with something that works on IE 6, you could use
>
> <div class="special">Some text</div>
>
> with
>
> .special { text-align: justify;
> text-justify: distribute;
> text-align-last: justify;
> text-transform: uppercase;
> margin: 0 3em; }
>[/color]

Well done!

some detail:

<style>
..special { text-align:justify;
text-justify:newspaper;
text-align-last:justify;
padding:0 5%;
margin:0 20%;
border:green solid 1px;}
</style>

<div class="special">Some text</div>


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

re: "Justify"-like effect within text

Jukka K. Korpela wrote:
[color=blue]
> "Owen Jacobson" <ojacobson.usenet@mx-deus.net> wrote:
>[color=green]
> > We all know that text-align: justify; is supposed to justify the
> > block's text across the box.[/color]
>
> And justification generally makes things worse, see
> http://www.cs.tut.fi/~jkorpela/www/justify.html[/color]

Yah. I don't believe he's justifying the bulk of his content, only
attempting to get the described effect on a heading.
[color=blue]
> I don't think there's a way to do that in "standard" CSS, but if your
> friend is happy with something that works on IE 6, you could use[/color]

Unfortunately not. He's a Mac person, to start with, and he's not a
fan of platform-specific solutions. Smart man.
[color=blue]
> <div class="special">Some text</div>
>
> with
>
> .special {
> ...
> text-justify: distribute;
> ...
> }[/color]

Is there any movement afoot to add something similar to CSS 3, as far
away as that may actually be? It seems like a useful feature.

Owen

re: "Justify"-like effect within text

Owen Jacobson wrote:[color=blue]
> Jukka K. Korpela wrote:[color=green]
>> <div class="special">Some text</div>
>>
>> with
>>
>> .special {
>> ...
>> text-justify: distribute;
>> ...
>> }[/color]
>
> Is there any movement afoot to add something similar to CSS 3, as far
> away as that may actually be? It seems like a useful feature.[/color]

4.2. Justification: the 'text-justify' property
<http://www.w3.org/TR/css3-text/#justification-prop>

--
Steve

Authority without wisdom is like a heavy axe without an edge, fitter to
bruise than polish. -Anne Bradstreet