Верх страницы
Обложка к записи Кроссбраузерный перенос строк
Время для прочтения: 0 мин. 4 сек.

Кроссбраузерный перенос строк

Чтобы управлять переносами строк, когда они не помещаются по ширине в заданную область, можно использовать кроссбраузерную комбинацию word-wrap и white-space.

Свойство word-wrap носит черновой характер и при валидации документа на CSS 3 выдает ошибку.

Свойство white-space устанавливает, как отображать пробелы между словами. В обычных условиях любое количество пробелов в коде HTML показывается на веб-странице как один. Исключением является тег <pre>, помещенный в этот контейнер текст выводится со всеми пробелами, как он был отформатирован пользователем. Таким образом, white-space имитирует работу тега <pre>, но в отличие от него не меняет шрифт на моноширинный.

div {
    white-space: pre;         /* CSS2 */
    white-space: pre-wrap; /* CSS 2.1 */
    white-space: pre-line;   /* CSS 2.1/3 */
    white-space: -moz-pre-wrap !important; /* Mozilla */
    white-space: -hp-pre-wrap;   /* HP printers */
    white-space: -o-pre-wrap;     /* Opera 7 */
    white-space: -pre-wrap;       /* Opera 4-6 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

Ссылки

Автор: Кобзарёв Михаил

Русский разработчик с 20-ти летним стажем. Работаю с PHP, ООП, JavaScript, Git, WordPress, Битрикс, Joomla, Drupal, Opencart, DLE, Laravel, Moonshine, SuiteCRM.

Оптимизирую сайты под Google Page Speed, настраиваю импорты для больших магазинов на WooCommerce + WP All Import. Пишу плагины на заказ. Все мои услуги.

Веду блог о разработке, дайджест в телеграмме и в ВК.

Вы всегда можете нанять меня.

Комментарии
Подписаться
Уведомить о
guest

2 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии
Сайтостроитель
Сайтостроитель
10 лет назад

Спасибо, то что нужно!!!) А то уже совсем отчаялся найти решение…

Предыдущая запись
Следующая запись

Давайте дружить
в Телеграме

Авторский блог вашего покорного слуги в Telegram про web, программирование, алгоритмы, инструменты разработчика, WordPress, Joomla, Opencart, Laravel, Moonshine, фильмы и сериалы