css - Multi column HTML list that goes from top to bottom -


inline html list displayed in browser

item1    item2    item3    item4    item5    ... 

can achieve using html , css

item1    item6    item11 item2    item7    ... item3    item8 item4    item9 item5    item10 

use columns property:

ul {     list-style: none;     columns:100px 3;     -webkit-columns:100px 3; /* safari , chrome */     -moz-columns:100px 3; /* firefox */ } 

here's demo

if don't care order, more compatible way use percents li widths:

li {     display: inline-block;     min-width: 25%;     margin-right: 5%; } 

demo code here


Comments

Popular posts from this blog

database - VFP Grid + SQL server 2008 - grid not showing correctly -

jquery - Set jPicker field to empty value -

.htaccess - htaccess convert request to clean url and add slash at the end of the url -