Output lists or paragraphs in multi column format

ul {
    list-style: none;
    margin:0;
    padding:0;
}
ul > li {
    display: inline-block;
    width: 100%;
}
ul > li > ul >li {
    color: red;
}
div {
    -webkit-column-count:3;
    -moz-column-count:3;
    -ms-column-count:3;
    -o-column-count:3;
    column-count:3;
    -webkit-column-gap:15px;
    -moz-column-gap:15px;
    -ms-column-gap:15px;
    -o-column-gap:15px;
    column-gap:15px;
    columns:3;
}
  • List item 1
  • List item 2
  • List item 3
  • List item 4
  • List item 5
  • List item 6

Gives You:

  • List item 1
  • List item 2
  • List item 3
  • List item 4
  • List item 5
  • List item 6

Leave a Reply

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

33 − = 32