скрытое меню

Перенос слов

По нашему мнению : для простого и удобного чтения слова не должны рваться , лучше их начинать писать целыми с новой строки. Решаем проблему только через css.

Глобально настраиваем так :

word-wrap: break-word;  - надо , чтобы не рвал слова и переносил целиком 

/* hyphens: auto;  не надо использовать ,  т.к. будет вставлять дефисы*/

Теперь встает вопрос - что делать с очень длинными словами ? Проблема проявляется при адаптации к мобильной версии сайта, когда длинное слово не помещается по всей ширине , но и рвать его нельзя, то есть оно будет как-то больше чем ширина экрана.

Для варианта media с шириной небольшой экрана делаем так :


overflow-wrap: break-word;
word-break : break-word; 


/*word-break: break-all;*/

То есть если у нас есть такая стока :

а бб ссс дддд ееееееееееееееееееееееееееееееееееееееееееееееееееееееееееееееееееееееее жж ззззззззззззззззззззззззззззззззззззззззззззззззззззз

То на небольшой ширине страницы мы получим примерно такой результат или вот на картинке как выглядит :

фотка 1

Hyphens нам не нужны