Как сделать выравнивание текста по наклонной линии?

Даже примера кода нету : так как в голову не приходит как сделать

Гуру CSS3 как такое реализовать ?
Источник
Нашёл интересный вариант решение Пример
Вопрос задал на SO
Решение нашлось на SO
.element{ shape-outside: url(https://upload.wikimedia.org/wikipedia/commons/thumb/b/bf/Triangle-grey.svg/2000px-Triangle-grey.svg.png); shape-image-threshold: 0.2; float: left; height: 300px; padding: 0 20px; }

CSS shapes / dLotus

Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…Lorem ipsum…

Это круто ARPIL GOYAL выдал 100% результат

Ответ

Почти ничего сложного, если не бояться замарать ручки дикими костылями)
Вижу два варианта решения:
Использование shape-outside
Но, к сожалению, этот вариант абсолютно не кроссбраузерный и работает только в webkit-движках: http://caniuse.com/#feat=css-shapes
Куча блоков
В варианте с треугольным обтеканием это легко реализовать и автоматизировать процесс с помощью JS. Я считаю этот вариант вполне приемлемым, если того требует задача. Конечно, автоматизировать создание блоков в помощью js будет весьма затруднительно, если форма обтекания сложная.
В своем примере я использовал оба варианта.
С шейпами все ясно: по трем точкам нарисовал область обтекания и готово.
"Кучу блоков" я наплодил с помощью js: создал один блок шириной 300px и с помощью js наплодил после него потомков, каждый короче на 10px.
Пример на jsfiddle: https://jsfiddle.net/ipshenicyn/h2o9fbav/2/
HTML

очень много текста

CSS
Код треугольников обтекания:
.shape-left - это блок, который я буду плодить с помощью js
.shape-right - блок с использованием shape-outside
.shape-left{ float: left; width: 300px; height: 10px; clear: both; } .shape-right{ width: 400px; height: 400px; float: right; shape-outside: polygon(400px 0, 400px 400px, 0 400px); }
JS
Код, который множит .shape-left с убыванием ширины, создавая тем самым треугольную область:
var $el = $('.shape-left'), width = $el.width(), count = width / 10;
for(var i = 0; i < count; i++){ width = $el.width(); $el = $el.clone().css('width',width-10).insertAfter($el); }