Как сделать, чтобы в теге <pre> текст переносился по строкам (wrap text in pre tag)?

По-умолчанию текст, заключённый внутри тега <pre>, показывается на странице как есть. То есть если строка длинная, то она такой и останется. И следует либо вручную проставить переводы на новую строку, либо добавить в файл стилей следующее css-правило для тега <pre>:
pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ }

almix
Разработчик Loco, автор статей по веб-разработке на Yii, CodeIgniter, MODx и прочих инструментах. Создатель Team Sense.
Вы можете почитать все статьи от almix'а.
- 0 Twitter Bootstrap Carousel Crossfade (09.09.2013)
- 0 Inline-block vs float (22.08.2013)
- 0 Список li в две колонки (CSS) (13.03.2013)
- Асинхронная загрузка css (21.01.2021)
- Оверлей кнопка на видео HTML5 video overlay play button (15.02.2019)
- Flip-вращалка на css. Эффект кручения карточки на обратную сторону (25.10.2018)
- Выравниваем div по-центру другого div в меню Bootstrap (12.10.2018)
- Плавная прокрутка на странице (Bootstrap JS Scrollspy) (12.10.2018)
- Выдвигающаяся из значка форма поиска на сайте (27.11.2017)
- Выравниваем div внутри другого div по центру (27.11.2017)
- Пробелы между пунктами меню (16.11.2017)
- Как убрать placeholder при клике по input (04.11.2017)
- Выравнивание изображения по центру в Bootstrap (11.12.2016)
- Замена текста при наведении на него мышью. События onmouseover и onmouseout (25.03.2016)
- Прилипание блока к верху сайта при его прокручивании (17.02.2016)
- Как сделать какую-либо область на сайте кликабельной ссылкой? (11.08.2015)
- Красивое выравнивание характеристик на странице товара с отступами, отмеченными точками (11.07.2015)
- Сделать слайдер на Owl Carousel c текстом справа (03.02.2015)
- Скролл-эффекты CSS3 и JQuery при прокрутке страницы (13.01.2015)
- Отзывчивый или Адаптивный веб-дизайн (Responsive Web Design) (05.01.2013)
- Как сделать, чтобы в теге <pre> текст переносился по строкам (wrap text in pre tag)? (15.10.2012) ← вы тут
- Разные стили для внутренних и внешних ссылок (07.04.2012)
- Значок рубля для сайта (25.03.2012)
- Свои стили css для области редактора CKEditor (05.03.2012)
- Yii: Красим нечётные и чётные строки в CListView разными цветами с помощью css (23.02.2012)
