Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Der Titel des Dokuments</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-after: column; } </style> </head> <body> <h2>Ein Beispiel für die Eigenschaft break-after</h2> <div class="multicol"> <h2>Lorem ipsum</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sagittis, arcu ut pulvinar sollicitudin, enim purus mollis tellus, et porta elit sem in nulla. Integer a magna eget justo convallis porta. Vestibulum lacinia eget leo sed elementum. Quisque dapibus ullamcorper quam, at pretium quam eleifend a. Donec sit amet blandit risus. Nunc tempus tellus vitae nibh pellentesque imperdiet. Ut pulvinar rhoncus velit, ut euismod odio ornare vel.</p> <hr> <h2>Lorem ipsum</h2> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sagittis, arcu ut pulvinar sollicitudin, enim purus mollis tellus, et porta elit sem in nulla. Integer a magna eget justo convallis porta. Vestibulum lacinia eget leo sed elementum. Quisque dapibus ullamcorper quam, at pretium quam eleifend a. Donec sit amet blandit risus. Nunc tempus tellus vitae nibh pellentesque imperdiet. Ut pulvinar rhoncus velit, ut euismod odio ornare vel.</p> </div> </body> </html>