# Word-Wrap

As classes utilitárias de `<span class="text-sm px-1 rounded-sm !font-mono bg-sunset/10 text-rust dark:bg-dawn/10 dark:text-dawn">word-wrap</span>` no **WPF** são usadas para controlar o comportamento de quebra de palavras em elementos HTML, aplicando a propriedade CSS `<span class="text-sm px-1 rounded-sm !font-mono bg-sunset/10 text-rust dark:bg-dawn/10 dark:text-dawn">word-wrap</span>`. Elas ajudam a gerenciar textos longos em contêineres com largura limitada.

### Classes Disponíveis

- `w-nowrap`: Impede a quebra de palavras, mantendo o texto em uma única linha. Se o texto for muito longo, ele pode ultrapassar os limites do contêiner, **resultando em overflow**.
- `w-wrap`: Permite que palavras longas sejam quebradas em pontos arbitrários, ajustando o texto ao tamanho do contêiner e **evitando overflow**.

### Exemplos de Uso

#### Exemplo 1: Impedir Quebra de Palavras

```html
<div class="w-300px w-nowrap">
  <p>Supercalifragilisticexpialidocious</p>
  <!-- A palavra longa não será quebrada e pode exceder a largura de 300px do contêiner. -->
</div>
```

#### Exemplo 2: Permitir Quebra de Palavras

```html
<div class="w-300px w-wrap">
  <p>Supercalifragilisticexpialidocious</p>
  <!-- A palavra será quebrada para se ajustar ao contêiner de 300px. -->
</div>
```