Układ wielokolumnowy

Przełamanie kolumny

(CSS 3 - interpretuje Opera 11)

1. Przełamanie kolumny przed elementem:

   selektor { break-before: column }

2. Przełamanie kolumny po elemencie:

   selektor { break-after: column }

3. Blokada przełamania kolumny przed elementem:

   selektor { break-before: avoid-column }

4. Blokada przełamania kolumny po elemencie:

   selektor { break-after: avoid-column }

5. Blokada przełamania kolumny wewnątrz elemenu:

   selektor { break-inside: avoid-column }

Tekst nie zawsze musi przełamywać się między kolumnami tak, jak byśmy sobie tego życzyli. Możemy np. nie chcieć, aby tytuł znalazł się na końcu kolumny. W takim przypadku estetyczniej będzie wyglądało, jeśli kolumna przełamie się wcześniej, aby tytuł znalazł się na początku następnej. Taki efekt zapewnimy poprzez nadanie stylu:

h1 { break-after: avoid-column }

Z drugiej strony możemy chcieć wymusić przełamanie kolumny po zakończeniu w tekście sekcji, czyli np. zaraz po poziomej linii:

hr { break-after: column }

Wreszcie w pewnych przypadkach może nam zależeć, aby wybrany fragment tekstu - np. akapit - nigdy nie został przełamany do następnej kolumny:

p { break-inside: avoid-column }

Przykład:

• Linia rozdzielająca
• Łączenie kolumn

• Do góry
• Strona główna
• Drukuj rozdział
• Komentarze