white-space

<< text-indent tab-size >>

Esta propiedad te permite establecer un cierto comportamiento de los espaciados. Los valores más habituales que suele tener son: normal | nowrap | pre | pre-line | pre-wrap. Por defecto el valor es normal (transforma múltiples espacios en blanco en un solo espacio consecutivo), pero las otras opciones nos permite:

  • normal: Secuencias de espacios en blanco son reducidas a un solo espacio, los saltos de línea son tratados como espacios, se ajusta al contenedor.
  • nowrap: Los espacios se transforman en uno solo, ignora los saltos de línea.
  • pre: Respeta los espacios, pero ignora los saltos de línea salvo que tengamos un <br>
  • pre-wrap: Respeta los espacios y se ajusta al contenedor
  • pre-line: Respeta literalmente los espacios y suprime los espacios del final. Se ajusta al contenedor.

La diferencia entre pre-wrap y pre-line es que este último sí respeta liteteralmente los espacios que están antes del texto, mientras que si sobran después del texto los elimina.

h1{
    letter-spacing: 5px;
    text-align: center;
}
#palabras{
    word-spacing: 5px;
}
#lineas{
    line-height: 3em;
    text-indent: 5vw;
}
article{
    width: 300px;
    padding: 16px;
    border-radius: 10px;
    
}
#aPrimero{
    white-space: wrap;
}
#aSegundo{
    white-space: nowrap;
}

<< text-indent tab-size >>