Definición de .break-before en CSS
La propiedad CSS .break-before es ordenada, ya que permite, hace fuerzas o evita descansos en medios pagados, diseños de múltiples columnas y regiones. Al aplicar la propiedad a un elemento, lo que estamos haciendo es proporcionar una instrucción para romper o evitar descansos entre páginas, columnas y regiones.
Ejemplo de empleo de la propiedad break-before
Si te gustaría utilizar esta propiedad de CSS en tu hoja de estilos, hazlo de la siguiente forma:
break-before: auto | avoid | always | all | avoid-page | page | left | right | recto | verso | avoid-column | column | avoid-region | regionOtro ejemplo más avanzado de .break-before es el siguiente de CODEPEN:
Sintaxis de .break-before en CSS
break-before: auto|all|always|avoid|avoid-column|avoid-page|avoid-region|column|left|page|recto|region|right|verso|initial|inherit;Valores
| Valor | Descripción |
|---|---|
| auto | Defecto. Salto automático de página/columna/región antes del elemento |
| todos | Siempre inserte un salto de página justo antes del cuadro principal |
| siempre | Siempre inserte un salto de página antes del elemento |
| evitar | Evite un salto de página/columna/región antes del elemento |
| evitar-columna | Evite un salto de columna antes del elemento |
| evitar-página | Evite un salto de página antes del elemento |
| evitar-región | Evite una ruptura de región antes del elemento |
| columna | Siempre inserte un salto de columna antes del elemento |
| izquierda | Inserte uno o dos saltos de página antes del elemento para que la página siguiente tenga el formato de página izquierda |
| página | Siempre inserte un salto de página antes del elemento |
| a la derecha | Inserte uno o dos saltos de página antes del cuadro principal para que la página siguiente tenga el formato de página recto |
| región | Siempre inserte un salto de región antes del elemento |
| Correcto | Inserte uno o dos saltos de página antes del elemento para que la página siguiente tenga el formato de página derecha |
| verso | Inserte uno o dos saltos de página antes del cuadro principal para que la página siguiente tenga el formato de página inversa |
| inicial | Establece esta propiedad en su valor predeterminado. |
| heredar | Hereda esta propiedad de su elemento principal. |
Exploradores compatibles con .break-before
Los números de la tabla especifican la primera versión del navegador que es plenamente compatible con la propiedad.
Los números seguidos de -webkit- detallan la primera versión que funcionó con un prefijo.
| Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| break-inside | 50.0 | 10.0 | 65.0 | 10.0 | 37.0 |
