display unknown number of elements - html

Question

I need to show "x" number of cateogories in a menu (basically a hidden div that pop up when someone clicks on a nav menu called "Category"). No problem with the div, but I am struggling with arranging the categories in any form of order inside the div. I don't want it to be a single column list an stretch all the way down to the page, so I would like either a multi column list or something else. I hear multi column list have compatibility challenges and are difficult to deal with. What other options do I have?
Something similar to the category list at http://www.answerbag.com/
Thanks

Answer 1

I was writing up an answer, but this article does a better job:
http://www.alistapart.com/articles/multicolumnlists/
It covers a number of different options, including the floated method used at answerbag, and one or two that are semantically more sensible while still ordering by column instead of by row.

Answer 2

Not so much, no. Coding a multi column list is easy as long as you're careful about your widths and clearing floats:
HTML
<div id="list">
<ul>
<li>Cat 1</li>
<li>Cat 2</li>
<li>Cat 3</li>
</ul>
<ul>
<li>Cat 4</li>
<li>Cat 5</li>
<li>Cat 6</li>
</ul>
<div class="clear"></div>
</div>
CSS
#list {
width: 400px;
}
#list ul {
float: left;
width: 200px; /* This width should be #list width divided by number of columns */
margin: 0;
padding: 0;
list-style: none;
}
#list li {
margin: 0;
padding: 5px 0;
}
.clear {
clear: both;
}