Question

I have a span, which is inside a div of fixed width. The span contains text that might wrap to more than one line.

My problem is that I want the first line of text to be right-aligned, and the subsequent lines (caused by word wrap) to automatically left align with the first line.

I.e.,

    This is what I want to
    happen after a word
    wrap

    This is what I do NOT
           want to happen

Answer 1

Between your span and div, add another div with a float:right.

Such as:

<div style="width:200px">
  <div style="float:right">
    <span>This is what I want to happen after a word wrap</span>
  </div>
</div>

Don’t forget to clear your floats.