Mon, 2004-08-02 11:28
Hi all! I'm wondering is there a way in CSS to align text unjustified (not sure if that's the right word). Meaning that margin on each line is different, accompaning eg. with an image. I'll put an example here using just space to give you some idea, what I'm meaning:
Duis autem vel eum iriure dolor
in hendrerit in vulputate velit esse
molestie consequat, vel illum dolore
eu feugiat nulla facilisis at vero eros et
accumsan et iusto odio dignissim qui blandit
praesent luptatum zzril delenit augue duis dolore
te feugait nulla facilisi. Lorem ipsum dolor sit
amet, consectetuer adipiscing elit, sed diam nonummy
nibh euismod tincidunt ut laoreet dolore magna aliquam
rat volutpat.
Any ideas how should I do this without using any extra-spaces?
Mon, 2004-08-02 15:49
#1
Unjustified paragraph?
well I think you are looking for:
http://www.meyerweb.com/eric/css/edge/raggedfloat/demo.html
Although I have recently done an example that is far more efficient on load time, but have not written it up as a tutorial or anything (coming soon). You can see my version:
http://www.caffeinefuelled.net/richard-hotlink/tests/slanty/chef5.htm
Feel free to take apart my code, the method is similar, but approaching from a slightly different angle and only using one image.
//edit, as a side not/disclaimer type thing, I only tested in a couple of browsers FF & IE6/win, although I don't think there is anything that might throw an error.
Mon, 2004-08-02 20:28
#2
Unjustified paragraph?
A much easier way is just to use the <pre> tag, just remember to specify the font and such in the css so it maches the rest of the site -
pre {font: blah; font-size: blah; etc }
then
<pre>
pie
line 2
line 3
etc
and so on
</pre>
Tue, 2004-08-03 07:47
#3
Unjustified paragraph?
thepineapplehead wrote:
A much easier way is just to use the <pre> tag
You can do that, but think about the following:
1) if you want to re-write the paragraph, you have to manually reformat, which effectively rules out dynamic content
2) Try text zooming a pre tag 
3) If you have the same graphic on every page, as part of your layout, then every page has to be reformatted individually in the html.
Both methods will work and both have their advantages, but if you are going to use the pre tags, you might be better off using a p, and restyle the whitespace, for the sake of semanticity.