使用CSS从单个链接div中创建表格样式的短列方框

Question

我有一个插件，可以为Wordpress (http://www.hothouseblog.org/)显示标签云。通常，它显示在水平运行列表中。我寻找答案，将这个列表转换为三列或四列垂直运行的项目。

使用CSS，我已经让项目以行的形式显示，但链接仍然是水平运行的，而我希望项目垂直堆叠。这是白日梦吗？

.widget_tag_cloud {
display: table;
background-color: #000000;
padding: 10px 20px;
width: 580px;
height: 200px!important;}

.widget_tag_cloud a {
font-size: 14px!important;
text-transform: uppercase;
float: left;
width: 100px;
display: block;}

Answer 1

以目前的html格式来看，是的，那将是白日做梦。锚元素不是为此而设计的。您必须将它们划分为div列，或者将它们拆分为ul >li列表堆栈。而display: table;在这里并不是很合适。

使用垂直约束来填充方框几乎是不可能的，除非使用多个:nth-child()伪类，但这将是一个复杂的解决方案，需要IE8的javacript polyfill来支持它。