Preservando freios de linha em HTML

Freqüentemente, é necessário exibir alguma entrada de texto de várias linhas do usuário em uma página, por exemplo, um endereço de um campo textarea. Às vezes, usar uma pré- tag é uma opção, mas o texto pode sair da caixa e bagunçar o layout da página.

Eu costumava confiar no helper simple_format do Rails para preservar as quebras de linha. Mas acabei de aprender que você pode fazer isso puramente com CSS

// HTML
<span class='with-linebreaks'>
  Some Lines
  here
</span>

// CSS
.with-linebreaks{ white-space: pre-wrap; }

pre-wrap se comporta exatamente como a tag pre , exceto que adiciona quebras de linha extras para evitar que o texto saia da caixa do elemento.

Eureka!