Multi Kolom Text Dengan CSS3

artikel CSS3 Modul Multi Kolom ini terinspirasi dari dari www.red-team-design.com , yang menjelaskan beberapa penggunaan CSS3 untuk multi kolom pengganti table dan property float pada <div>. Multi-kolom modul saat ini hanya didukung di browser Mozilla dan Webkit (Safari dan Chrome), ini berarti bahwa tidak ada dukungan untuk browser seperti IE dan Opera. namun itu bukan masalah serius selama kita memahamai peningkatan progresif pada browser tersebut.

Lihat Demo

CSS3 Column count

#colom-count {
  -moz-column-count:3;
  -webkit-column-count:3;
  -moz-column-gap:30px;
  -webkit-column-gap:30px;
  text-align:justify;
}

CSS3 Column width

#column-width {
  -moz-column-width:200px;
  -webkit-column-width:200px;
  -moz-column-gap:30px;
  -webkit-column-gap:30px;
  text-align:justify;
}

CSS3 Column rules

#column-rules-bordered {
  -moz-column-width:200px;
  -webkit-column-width:200px;
  -moz-column-gap:30px;
  -webkit-column-gap:30px;
  -moz-column-rule:2px solid #9c9c9c;
  -webkit-column-rule:2px solid #9c9c9c;
  text-align:justify;
}

---

Post By : denzdii

Sumber : multi column text using css3