Die CSS-Eigenschaft break-inside definiert, wie sich ein Break (Seite, Spalte) innerhalb der erzeugten Box verhalten soll. Diese Eigenschaft wird ignoriert, wenn das generierte Feld nicht angegeben ist. Es hat vier Werte
Diese Eigenschaft ist veraltet.
Anfangswert
auto
Gilt für
Block-Eevel-Elemente
Geerbt
Nein
Animierbar
Diskret
Version
CSS3
DOM Syntax
object.style.breakInside = "avoid";
Syntax
break-inside: auto | avoid | always | all | initial | inherit;
Beispiel
<!DOCTYPE html><html><head><title>The title of the document</title><style>.multicol {
background-color: #eee;
padding: 10px;
/* Safari and Chrome */
-webkit-column-count: 3;
-webkit-column-rule: 2px dotted #ccc;
/* Firefox */
-moz-column-count: 3;
-moz-column-rule: 2px dotted #ccc;
/* CSS3 */column-count: 3;
column-rule: 2px dotted #ccc;
}
.multicol hr {
break-inside: column;
}
</style></head><body><divclass="multicol"><h2>Lorem ipsum</h2><p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie. Lorem Ipsum ist der Standard-Dummy-Text der Branche seit den 1500er Jahren, als ein unbekannter Drucker ein Setzschiff vom Typ nahm und es zu einem Musterbuch verarbeitete. Sie hat nicht nur fünf Jahrhunderte, sondern auch den Sprung in den elektronischen Satz ohne Wesentlichen Veränderungen überlebt.</p><hr><h2>Lorem ipsum</h2><p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie. Lorem Ipsum ist der Standard-Dummy-Text der Branche seit den 1500er Jahren, als ein unbekannter Drucker ein Setzschiff vom Typ nahm und es zu einem Musterbuch verarbeitete. Sie hat nicht nur fünf Jahrhunderte, sondern auch den Sprung in den elektronischen Satz ohne Wesentlichen Veränderungen überlebt.</p></div></body></html>
