On 2008-10-31, Jason Carlton <jwcarlton@gmail.comwrote:
Quote:
Sorry if this goes through twice, I had an error the first time that I
submitted.
>
I have a bit of text that has a varying length, and I'm wanting to
float text to the right. The problem is that the text needs to wrap to
2 lines instead of 1, and I'm wanting to float the text to the right
of the second line.
>
Something like this:
>
blah blah blah blah blah blah blah blah blah
blah blah blah... floated text
>
(If that doesn't show up correctly, I have 23 whitespaces between
"..." and "floated text")
>
I'm chopping the text at 75 characters and adding the ... myself, so I
know that the total length of blah blah will be 75 characters or less.
But I have no way of knowing if the top line will be 40 characters, 45
characters, or what, before it wraps.
>
I originally thought that this would work:
>
><div style="float: left: width: 80%">blah blah...</div>
><div style="float: right: width: 20%">floated text</div>
>
But this makes the top line wrap at 80%, too, where I only want the
second line to be 80%. I want the floated text to be aligned directly
beneath the last word of the first line.
|
This last requirement limits your options, assuming you want the last
word of the first line to follow the words before it with the normal
amount of spacing.
You will have to position the right floated text relative to that last
word probably using absolute positioning. But I'm not convinced that's
what you want based on your solution below:
Quote:
The only solution I can think of is to go to the 50th character, then
go back to the last whitespace and chop from there, so that there
would be a variable on line 1 and a separate variable on line 2.
Something like:
>
$var1 = "blah blah blah blah blah blah blah blah blah";
$var2 = "blah blah blah...";
>
$var1
><div style="float: left: width: 80%">$var2</div>
><div style="float: right: width: 20%">floated text</div>
>
This should float correctly, but is there an easier way?
|
That won't put "floated text" directly beneath the last word on the
first line.
If you're going to do that, you could just put all the text in a single
block, and then at the 50th character insert:
<br><span style="float: right; width: 20%">floated text</span>.
Leave out the <brif you're not too particular about exactly where that
first line breaks.