Кто как решает проблемы с длинными словами?

Вопросы по вёрстке и JavaScript
Ответить
Аватара пользователя
Ghost_nsk
Сообщения: 787
Зарегистрирован: 2012.01.01, 00:45
Откуда: Новосибирск

Кто как решает проблемы с длинными словами?

Сообщение Ghost_nsk » 2017.08.08, 06:57

Товарищи, день добрый! Допустим у Вас есть крупный проект, много моделей, много атрибутов с возможностью ввода произвольного текста. Как порешать проблему с длинными словами, когда какой-нибудь Вася целенаправленно вбивает строку без пробелов из 200 символов, что выбивает всю верстку? Проблема в том, что таких полей не одно, а почти по всему сайту.

Сейчас вижу несколько путей:
1) разные комбинации word-wrap: break-word, overflow-wrap: break-word и пр. - не помогают, потому что где-то обрезаются длинные слова, а где-то и обычные, как тут найти консенсус - не понятно
2) расставлять мягкие переносы / пробелы / удалять длинные слова через javascript на клиенте при выводе - грузить браузер по жесткачу + надо дождаться пока прогрузятся все скрипты, а это означает, что верстка будет прыгать
3) расставлять мягкие переносы / пробелы / удалять длинные слова через php на выводе через функцию типа wordwrap, костыльно допиленную до utf-8, тогда придется допиливать вызов этой функции на все выводы текста на сайте, что тоже не комильфо
4) расставлять мягкие переносы / пробелы / удалять длинные слова через php при сохранении в базу - доп. нагрузка при сохранении, обновлении записей при каждом запросе

пока склоняюсь к последнему варику, может Вы чего хорошего подскажете :)
короче, в атаку! :)

Аватара пользователя
yiijeka
Сообщения: 2956
Зарегистрирован: 2012.01.28, 09:14
Откуда: Беларусь

Re: Кто как решает проблемы с длинными словами?

Сообщение yiijeka » 2017.08.08, 09:20

Мне первого хватает, один из последних css.trick

Код: Выделить всё

li.size {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  list-style-position: inside;  
}
Для других блоков подобное использую, просто я стараюсь всегда про это помнить, когда делаю фронтенд(также как и про Html::encode()), т.е. учитывать, что блок может содержать либо 255 символов одного слова или 65000+ букв без пробелов и если это нарушит общую структуру страницы, то применяю css трюк.

P.S. 4 мне не нравиться, т.к. завтра размеры поменяются блока и вам опять надо что-то подбирать по параметрам обрезания...
Ну и про это нужно помнить только когда конечный потребить вносит подобный текст, а не модераторы, админы...

Аватара пользователя
Ghost_nsk
Сообщения: 787
Зарегистрирован: 2012.01.01, 00:45
Откуда: Новосибирск

Re: Кто как решает проблемы с длинными словами?

Сообщение Ghost_nsk » 2017.08.08, 11:59

Вроде следующая тема решает проблему:

Код: Выделить всё

/** Патч против особо любопытных Васьков */
.container, ul, li, a  {
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    max-width: 100%;
}
вся фишка была в max-width
может кому пригодится..
короче, в атаку! :)

zelenin
Сообщения: 10166
Зарегистрирован: 2013.04.20, 11:30

Re: Кто как решает проблемы с длинными словами?

Сообщение zelenin » 2017.08.08, 14:18

> удалять длинные слова через php при сохранении в базу

данные от пользователя не надо удалять. редактируйте только при выводе

> доп. нагрузка при сохранении, обновлении записей при каждом запросе

сколько запросов в день будет на добавление записи? миллионы? миллиарды?

Ответить