Свойство overflow-wrap
Определяет, должен ли браузер вставлять разрывы строк в неразрывную строку, если достигнут конец строки элемента
overflow-wrap: break-word;Пошаговый план! Как быстро научиться создавать сайты!
- поддерживается начиная с
- частичная поддержка до
- не поддерживается
Значения
overflow-wrap: normal;
Обычное поведение строки. Строка будет обрываться только в обычных точках разрыва строки
<style>
.example-1 {
width: 300px;
padding: 5px;
overflow-wrap: normal;
background: #55bb61;
}
</style>
<div class="example-1">csscscsscsscsscsscsscsscsscsscsscsscsscsscsscsscssscsscsscss</div>csscscsscsscsscsscsscsscsscsscsscsscsscsscsscsscssscsscsscss
overflow-wrap: break-word;
Слово будет разбито и перенесено на новую строку в том месте, где достигло окончания строки
<style>
.example-2 {
width: 300px;
padding: 5px;
overflow-wrap: break-word;
background: #55bb61;
}
</style>
<div class="example-2">csscscsscsscsscsscsscsscsscsscsscsscsscsscsscsscssscsscsscss</div>csscscsscsscsscsscsscsscsscsscsscsscsscsscsscsscssscsscsscss