jquery/css wrap text bottom up

Question

Я пытаюсь обернуть текст в div, используя css и/или jQuery, чтобы нижняя строка была самой длинной.

так, а не

__________ 
|this is | 
|text | 
|________| 

было бы сказать

__________ 
|this | 
|is text | 
|________| 

можно легко обернуть текст с помощью

white-space: pre-wrap; 

Но я не могу найти ничего, что позволит мне делать это.

(одна мысль, что я должен был бы обратить вспять текст, найти, где происходит перенос строки, применить <br/> в тех же местах, с текстом в будущем .. но я не знаю, как проверить, где обертывается строка)

Answer 1

Я закончил маршрут, реверсировал, проверил, где были разрывы линии, и затем вставляя их соответственно. Пожалуйста, не стесняйтесь использовать мою функцию. Эта функция принимает элемент jQuery (с текстом, который уже обертывает), и перевертывает его текст вверх.

function wrapUp(element){ 
    width = element.width(); 
    string = element.text().split(' '); 
    element.text(''); 
    reversed = string.reverse(); 
    var height = 0; 
    for (var i=0;i<reversed.length;i++){ 
     reversed[i] += ' '; 
     element.text(element.text()+reversed[i]); 
     if (height != element.height()){ 
      reversed.splice(i,0,"<br/>"); 
      i++; 
     } 
     height = element.height(); 
     console.log(element.height()); 
    } 
    element.html(reversed.reverse().join('')); 
} 

Answer 2

Их плагин в JQuery называется bacon

с этим можно обернуть текст в соответствии с вашими потребностями в любой форме вы хотите, я знаю, что вы должны делать вещи, над ним, но я думаю, что это может помочь вам.

$(".baconMe").bacon({ 
    'type' : 'bezier', 
    'c1' : { x : 10,  y : 0 }, 
    'c2' : { x : -115,  y : 170 }, 
    'c3' : { x : 35,  y : 340 }, 
    'c4' : { x : 15,  y : 480 }, 
    'align' : 'right' 
}