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

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

Чтобы управлять переносами строк, когда они не помещаются по ширине в заданную область, можно использовать кроссбраузерную комбинацию 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+ */
}

Ссылки


Теги:

  • Сайтостроитель

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

    • http://www.kobzarev.com/ Кобзарёв Михаил

      Рад стараться )))