MyTetra Share
Делитесь знаниями!
Самый правильный и простой перенос строк текста в HTML посредством CSS
Время создания: 10.01.2022 15:16
Текстовые метки: html, css, div, перенос, строка, слово, блок, свойство
Раздел: Компьютер - Программирование - HTML и CSS
Запись: xintrea/mytetra_syncro/master/base/1641816984yqcl7mf42y/text.html на raw.github.com

Если нужно сделать настройку переноса текста в каком-либо блоке <div>, вестальщики пытаются сделать это стандартными свойствами CSS2/CSS3. Обычно, верстальщика устроит следующий механизм переноса:



Переносить, если необходимо, в местах пробелов и знаков препинания. Если текст имеет непрерывную строку символов, которая шире ширины блока, то такую строку перенести принудительно, разорвав строку на символе, который выходит за ширину блока.



Проблема в том, что даже в стандарте CSS3 нет такого свойства. И нет совокупности свойств, которые бы обеспечили такое поведение.


Однако все современные браузеры имеют "устоявшее" свойство, которое не входит в стандарт, но делает именно то, что нужно:



<div style="word-break: break-word;">



Другими словами, данное свойство не входит в стандарт, но работает (почти?) везде и решает проблему «умно». У многих веб-студий это свойство используется в продакшене.


Так же в этом разделе:
 
MyTetra Share v.0.59
Яндекс индекс цитирования