<p>I'm using <code>ColdFusion</code> to populate a template that includes HTML unordered lists (<code>&lt;ul&gt;</code>s).</p>

<p>Most of these aren't that long, but a few have ridiculously long lengths and could really stand to be in 2-3 columns.</p>

<p>Is there an HTML, ColdFusion or perhaps JavaScript (I'm accepting jQuery solutions) way to do this easily?  It's not worth some over-complicated heavyweight solution to save some scrolling.</p>

There is no pure CSS/HTML way to achieve this, as far as I know.  Your best bet would be to do it in pre-processing (
```
if list length > 150, split into 3 columns, else if > 70, split into  2 columns, else 1
```
).
The other option, using JavaScript (I'm not familiar with the
jQuery
library specifically) would be to iterate through lists, probably based on them being a certain class, count the number of children, and if it is a high  enough number, dynamically create a new list after the first, transferring some number of list items to the new list.  As far as implementing the columns, you could probably float them left, followed by an element that had the style
```
clear: left
```
or
```
clear: both
```
.
```
```
.column {
  float: left;
  width: 50%;
}
.clear {
  clear: both;
}
```
```
```
```
<ul class="column">
  <li>Item 1</li>
  <li>Item 2</li>
  <!-- ... -->
  <li>Item 49</li>
  <li>Item 50</li>
</ul>
<ul class="column">
  <li>Item 51</li>
  <li>Item 52</li>
  <!-- ... -->
  <li>Item 99</li>
  <li>Item 100</li>
</ul>
<div class="clear">
```
```