1

I'm not sure a better way to explain this except to possibly look at a site like craigslist or something.

What it does now - 

*****
*1  *
*2  *
*3  *
*****

What I want - 

*****
*147*
*258*
*369*
*****

http://jsfiddle.net/N8qf8/

I made a fiddle but of course I can't get the overflow to do what I want. Any idears? Applying overflow: auto; just gives it a scroll bar when it hits max-height, is there anything to allow to it go to the next column?

PW Kad
  • 14,953
  • 7
  • 49
  • 82
  • 1
    Duplicate of this: http://stackoverflow.com/questions/12564700/putting-li-in-the-next-column-after-specific-height basically add column-count:3 to your ul css – Gary Schreiner May 09 '14 at 00:01

1 Answers1

1

In supported browsers you can use CSS3 columns:

Updated Example

ul {
    overflow: auto;
    max-height: 70px;
    -webkit-column-count:3;
    -moz-column-count:3;
    column-count:3;
}

Support for this can be found here.

Josh Crozier
  • 233,099
  • 56
  • 391
  • 304
  • I believe Gary was right in the comments this is a duplicate question and answer, thanks for the answer though. – PW Kad May 09 '14 at 00:04