jquery – 这是对表的有效使用吗？还有更好的选择吗？

我在网站上有几页,我需要允许用户从颜色列表中选择颜色.该列表从数据库加载,并且可以包含任意数量的颜色.控件的确切大小取决于页面.我知道有很好的插件可用于选择颜色,但我是根据设计构建的. (阅读：我不能使用第三方控件)

我在这里使用表编写了一个工作解决方案(http://jsfiddle.net/Cfj4T/1/).此示例的主要目的是显示我可以通过在容器上设置宽度来更改整个颜色选择的宽度：

div.select-large {
    width: 560px;
}

div.select-small {
    width: 280px;
}

问题是：这是一个错误的使用表吗？是否有一种解决方案可以在“a”标签或div元素上使用css？那会是什么样的？

注意 – 该示例由angular生成并复制到JSFiddle中,因此不要过多地阅读“a”标记中的额外属性.

一个地方的所有选项： – 如果有人想看到答案到目前为止我已将它们全部放入原始JSFiddle(http://jsfiddle.net/Cfj4T/6/).他们的工作非常好,所以感谢所有人！

不要使用< table>表格数据以外的任何其他内容.

原因是现在您可以使用现代CSS获得表格式布局的所有好处,并且您的文档在语义上是正确的,这对于诸如屏幕阅读器之类的工具来说是很好的.

使用使用display：table和display：table-cell的元素替换表格和表格单元格,您将获得具有更好标记的相同结果.

这是一个jsFiddle示例：http://jsfiddle.net/r9AgB/1/

如果您必须支持不能与display：table-cell一起使用的旧浏览器,请在< a>上设置百分比宽度.元素取决于所需的数量. CSS支持小数百分比值(1.234％).