Как сделать или запретить перенос текста CSS

Как правило, текст в HTML переносится автоматически, если он не помещается в одну строку, но бывают случаи, когда текст необходимо перенести, или наоборот запретить перенос. Для того, чтобы запретить перенос текста можно использовать свойство white-space со значением nowrap, а для того, чтобы текст переносился можно использовать с свойство word-wrap со значением break-word.

Пример

Lorem Ipsum

Lorem Ipsum

HTML


<!-- Перенос слов -->
<p class="text-ex-wrap">Lorem Ipsum</p>
<!-- Запрещаем перенос слов -->
<p class="text-ex-space">Lorem Ipsum</p>
      

CSS


.text-ex-wrap{
  word-wrap: break-word; /* Перенос слов */ 
}
.text-ex-space{
  white-space: nowrap; /* Запрещаем перенос слов */
}