html - parrafos - meta tags generator

¿Cómo puedo evitar tener solo una palabra colgante en una nueva línea en un elemento HTML?

Question

Estoy construyendo una página web simple con un poco de contenido de marketing. Una cosa que no me gusta es que si una línea de texto es demasiado larga, se ajustará a la siguiente línea, lo que está bien , pero a menudo se ajusta de tal manera que solo hay una palabra en la nueva línea, que son solo malas noticias desde el punto de vista del diseño.

Tal y tal no tiene por qué ser difícil. Tal y tal producto lo hace
fácil

¿Qué puedo hacer para garantizar dinámicamente al menos dos palabras en cada línea colgante?

Tal y tal no tiene por qué ser difícil. Tal y tal producto hace
es facil

Answer 1

La solución simple es usar un espacio sin interrupciones entre las dos últimas palabras al final de un párrafo.

 

<p>Such and such doesn''t have to be difficult. Such and such product makes it&nbsp;easy</p>

Esto puede ser tedioso si tiene mucho contenido y especialmente si está bajo control comercial. En ese caso, es posible que pueda encontrar una biblioteca o escribir una solución que inserte automáticamente el espacio sin interrupción entre las dos últimas palabras de cada párrafo.

Pruebe esto: http://matthewlein.com/widowfix/

Answer 2

EDITAR: la mejor respuesta es mucho más limpia, probablemente deberías usarla. Dejo mi respuesta porque funciona y tiene cierto valor para casos extraños (por ejemplo, si usa un guión en lugar de un espacio, si no desea usar   etc.).

Aquí hay una pequeña solución ordenada. Crea una clase de CSS como esta:

.nobr { white-space:nowrap; }

No se permitirá que ningún elemento con la clase "nobr" envuelva el espacio en blanco (espacios, pestañas, etc.) en líneas nuevas. Así que solo rodee las dos últimas palabras de su texto con un span.nobr .

<p>Such and such doesn''t have to be difficult. Such and such product makes <span class="nobr">it easy</span></p>