Alfred’s CSS3 Notes – Multi-Column Text

Only supported in Webkit and Gecko, at the moment. Not available in Opera or IE.

section#mysection {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-width: 15em;
-moz-column-width: 15em;
column-width: 15em;
-webkit-column-gap: 5em;
-mox-column-gap: 5em;
column-gap: 5em;
-webkit-column-rule: 2px solid #ff0000;
-mox-column-rule: 2px solid #ff0000;
column-rule: 2px solid #ff0000;
}

Cannot:

  • select a given column
  • size columns differently
  • specify percentages

column-rule property allows for border type effect between columns.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.