⚙️ Что такое свойство white-space в CSS и зачем оно используется?

Свойство white-space управляет тем, как обрабатываются пробелы и переносы строк внутри блока.

Оно позволяет контролировать отображение текста: переносить ли его, сохранять ли пробелы и переносы из исходного кода.

➡️ Пример:

<div class="box">
  Текст   с   лишними
  пробелами и переносами.
</div>

<style>
  .box {
    width: 200px;
    border: 1px solid #ccc;
    white-space: pre-wrap;
  }
</style>

🗣 В этом примере white-space: pre-wrap сохраняет все пробелы и переносы.

Популярные значения:

• normal — стандартное поведение (переносы, лишние пробелы убираются)
• nowrap — текст в одну строку
• pre — сохраняются пробелы и переносы (как в <pre>)
• pre-wrap — сохраняет пробелы + разрешает переносы

white-space полезен для отображения кода, сообщений или форматированного текста.

CodeBase | Frontend | #CSS