Question

我需要在菜单中显示“x”数量的cateogories（基本上是当有人点击名为“Category”的导航菜单时弹出的隐藏div）。没有div的问题，但我正在努力在div中以任何形式的顺序排列类别。我不希望它一直是一个列列表，所以我想要一个多列列表或其他东西。我听说多列列表存在兼容性挑战，很难处理。我还有其他选择吗？

类似于http://www.answerbag.com/

的类别列表

由于

Answer 1

我正在写一个答案，但这篇文章做得更好：

http://www.alistapart.com/articles/multicolumnlists/

它涵盖了许多不同的选项，包括在answerbag中使用的浮动方法，以及在按列而不是按行排序时在语义上更合理的一个或两个选项。

Answer 2

没那么多，没有。只要您注意宽度和清除浮动，就可以轻松编写多列列表：

<强> 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;
}

显示未知数量的元素

2 个答案: