
Etiqueta PRE, desbordamiento en gmail y solución con nl2br o white-space
Me he encontrado con un problema que parece afectar exclusivamente a Gmail y que ocurre al recibir un mail que contiene la etiqueta pre.
La misión de esta etiqueta es pre-formatear su contenido, con lo cual mantiene en el texto los espacios en blanco, saltos de línea, etc. Y es justamente por esa razón por la que debemos tener mucho cuidado (no soy muy amigo de emplearla).
En Gmail, por ejemplo se producía un desbordamiento horizontal, donde salia el scroll y el texto continuaba a lo largo y ancho de la ventana :)
Como solución, sustituir pre por un simple div en conjunción con una de estas dos opciones para el contenido que albergará:
Formatear el contenido con PHP: Podemos ayudarnos de la función nl2br que insertará los saltos de línea. Ejemplo:
nl2br('texto con formato');
Formatear el contenido con CSS: Podemos usar la regla white-space: pre; para simular el comportamiento de la etiqueta pre. Ejemplo:
<div style="white-space: pre;">
texto con formato
</div>