La propiedad CSS  widows especifica el número minimo de lineas en un contenedor de bloques que se deben mostrar en la parte superior de la pagina, region o columna.  Esta propiedad se usa normalmente para controlar como se producen las pausas.  

/* valores <enteros> */
widows: 2;
widows: 3;

/* valores globales */
widows: inherit;
widows: initial;
widows: unset;

En la tipografia, un widow is la ultima linea de un paragrafo que aparece solo en la parte superior de la pagina.

Valor inicial2
Applies toblock container elements
Heredableyes
Mediavisual
Valor calculadocomo se especifica
Animation typediscrete
Canonical orderper grammar

Sintaxis

Valores

<integer>
The minimum number of lines that can stay by themselves at the top of a new fragment after a fragmentation break. The value must be positive.

Sintaxis Formal

<integer>

Ejemplo

HTML

<div>
  <p>Este es el primer paragrafo que contiene algun texto.</p>
  <p>Este es el segundo paragrafo que contiene algún texto mayor que el primero. Es usado para desmostrar como trabaja widows.</p>
  <p>Este es el tercer paragrafo. Es un poco mas extenso en texto que el primero.</p>
</div>

CSS

div {
  background-color: #8cffa0;
  columns: 3;
  widows: 2;
}

p {
  background-color: #8ca0ff;
}

p:first-child {
  margin-top: 0;
}

Resultado

Especificaciones

Especificación Estado Comentario
CSS Fragmentation Module Level 3
La definición de 'widows' en esta especificación.
Candidate Recommendation Extiende widows para que se apliqye a cualquier tipo de fragmento, incluyendo paginas, regiones o columnas. 
CSS Multi-column Layout Module
La definición de 'widows' en esta especificación.
Working Draft Recomendaciones a considerar de widows en relacion con las columnas. 
CSS Level 2 (Revision 1)
La definición de 'widows' en esta especificación.
Recommendation Definición Inicial. 

Compatibilidad entre navegadores

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Soporte básicoChrome Soporte completo 25Edge Soporte completo 12Firefox Sin soporte NoIE Soporte completo 8Opera Soporte completo 9.2Safari Sin soporte NoWebView Android Sin soporte NoChrome Android ? Edge Mobile ? Firefox Android Sin soporte NoOpera Android ? Safari iOS Sin soporte NoSamsung Internet Android ?

Leyenda

Soporte completo  
Soporte completo
Sin soporte  
Sin soporte
Compatibility unknown  
Compatibility unknown

Ver tambien

Etiquetas y colaboradores del documento

Colaboradores en esta página: jpmontoya182
Última actualización por: jpmontoya182,