logo

¿Cómo ajustar texto en CSS?

CSS ajuste de línea La propiedad se utiliza para dividir las palabras largas y pasar a la siguiente línea. Esta propiedad se utiliza para evitar el desbordamiento cuando una cadena irrompible es demasiado larga para caber en el cuadro que la contiene.

Esta propiedad define los saltos en la palabra para evitar el desbordamiento cuando una palabra es demasiado larga para caber en el contenedor. Especifica la división de palabras cuando el contenido excede el límite del contenedor.

Sintaxis

 word-wrap: normal | break-word | initial l inherit ; 

Valores

normal: Es el valor predeterminado que se utiliza para dividir palabras sólo en los puntos de interrupción permitidos.

palabra de ruptura: Se utiliza para romper las palabras irrompibles.

inicial: Se utiliza para establecer la propiedad en su valor predeterminado.

heredar: Hereda la propiedad de su elemento padre.

Ejemplo

 .test { width: 200px; background-color: lightblue; border: 2px solid black; padding: 10px; font-size: 20px; } .test1 { width: 11em; background-color: lightblue; border: 2px solid black; padding: 10px; word-wrap: break-word; font-size: 20px; } <p> In this paragraph, there is a very long word: iamsooooooooooooooooooooooooooooooolongggggggggggggggg. The long word will break and wrap to the next line. </p> 
Pruébalo ahora

Producción

Cómo ajustar texto en CSS