Esses dias me deparei com um problema simples: um formulário contendo um campo de texto textarea (sem formatação), o qual armazena a informação, respeitando o padrão utilizado pelo usuário na edição, ou seja, com as quebras de linhas. Até aqui tudo bem. Porém, ao trazer o conteúdo de volta à página, ele vinha sem as quebras de linhas cadastradas. Então, observei que precisamos prever tal situação e levar em consideração que, se damos ao usuário certas possibilidades, o “seu estilo” precisa ser respeitado (na programação).

Bom, já dá pra saber que estou falando do ambiente WEB. Pois bem! Existem algumas possíveis soluções para corrigir isso: algumas envolvem banco de dados, outras, a alteração do código fonte do backend. Enfim… Venho te dar a boa notícia de que nada disso é necessário. Na verdade, o código de quebra de linha está vindo normal do banco de dados, só que está, simplesmente, sendo ignorada. O que fazer?

Existe uma propriedade CSS chamada white-space – o segredo está nessa definição. Vamos supor que o seu conteúdo esteja dentro de um DIV. Agora, precisamos definir sua propriedade da seguinte forma (claro que no seu caso, o CSS está em um arquivo separado, mas no meu exemplo eu o coloquei inline):

<div style="white-space: pre-wrap">
. . . 
seu conteúdo
. . .
</div>

Experimente isso e veja o resultado. Não são necessários códigos complicados, muito menos tratamentos em banco de dados. Às vezes, a solução mais simples é a perfeita! O que você achou? Já passou por isso? Se você aplicar esta solução, por gentileza, compartilhe o resultado comigo por aqui.

É vida que segue… 🙂

 FONTE