Делаем выравнивание по ширине красивым

Совсем недавно столкнулся с такой задачей, что понадобилось  в шаблоне очередного заказа  выравнять текст  по ширине ( justify ).
Выравнивание текста по ширине  и отображение его в узких столбцах известная проблема  многих веб-верстальщиков. Долго описывать не буду, но выглядит это ужасно с переносом длинных слов и большими промежутками между слов.

Было:

Решение было найдено благодаря одному замечательному плагину для wordpress   Hyphenator .
Hyphenator автоматически вставляет  тире  в конце строки текста.
Но активировать плагин не достаточно. Надо присвоить класс данного плагина к вашему основному шаблону, иначе РАБОТАТЬ НЕ БУДЕТ .

[crayon lang=’html’]class=”hyphenate text”[/crayon]

 И  для большего удобства, что бы каждый раз не  указывать в посте justify  надо  и это прописать в  вашем шаблоне.

И так  находим  тег  в который заключено содержание поста, как правило это
[crayon lang=’php’]< ?php the_content(); ?>[/crayon]
но в разных шаблонах зависимо от уровня сложности может отличаться  и присвоить ему данный стиль и класс
[crayon lang=’html’]class=”hyphenate text” style=”text-align: justify;”[/crayon]
После этого проверяем и у нас должен получиться желаемый результат.
Стало:

Этот метод мне настолько понравился, что мы решили сделать его на данном сайте.

У кого, что не получается или не понятно пишите в комментарии.

[download=http://downloads.wordpress.org/plugin/hyphenator.3.3.0.1.zip]

P.S. Как в css сделать перенос слов на другую строчку

Для того, что бы сделать в css перенос строк или слов надо добавить в файл стилей всего лишь один кроссбраузерный и валидный код:

white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, начиная с 1999 года */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */