Word-wrap en CSS3, cortar cadenas de texto

Hoy colaborando en un proyecto me he encontrado con una propiedad de CSS3 que desconocía: word-wrap.

Increiblemente es una propiedad que introdujo Microsoft, una maravilla que a más de uno le ahorrará trabajo y código backend.

Su función es cortar palabras cuando estas sobrepasan el ancho fijado por el div que las contienen.

/*Corta las palabras en los puntos permitidos*/
word-wrap: normal;
/*Cortará el texto cuando sea necesario */
word-wrap: break-word;

Esta segunda propiedad es la interesante. Como un ejemplo vale más que mil palabras, vamos a crear un div con un ancho fijo de 175px y vamos a trollear con un poco de texto dentro a ver que sucede según apliquemos una u otra propiedad.

Esta propiedad de CSS3 es compatible con todos los navegadores actuales: Google Chrome, Internet Explorer 8+, Firefox 3+, Opera 10+ y Safari 5+.

Yo procedo a implementarlo en un par de webs, ahorrandome ciertas chapucillas en php. #descubrimientodelasemana