CSS - 样式ul元素，就好像它们是表行元素

Question

我正在处理一个相当困难的样式问题。我有一个包含在div标签内的ul元素的集合。从视觉上看，每个ul应该在表格中显示为一行。结构如下：

<div class="tableElementEmulation"> 
    <ul class="trElementEmulation"> 
     <li class="tdElementEmulation">Some text</li> 
     <li class="tdElementEmulation">Some text</li> 
     <li class="tdElementEmulation">Some text</li> 
     <li class="tdElementEmulation">Some text</li> 
    </ul> 
</div> 

我需要对此结构进行样式设置，使其像HTML表格一样工作。这被证明是非常困难的，因为table元素本身处理大量的表格格式而没有任何额外的CSS。我不是一个CSS大师，所以复制这个功能到目前为止还不是很成功。

很明显，使用实际的HTML表格来实现这种格式会更容易，但我使用的插件仅适用于与上面列出的类似的结构。我被要求使用这个插件的页面，所以只使用HTML表格是不幸的。 有没有人有关于实现上面列出的这种html结构的表样式的任何建议？

Answer 1

HTML：

<div class="tableElementEmulation"> 
    <ul class="trElementEmulation"> 
     <li class="tdElementEmulation">Some text</li> 
     <li class="tdElementEmulation">Some text</li> 
     <li class="tdElementEmulation">Some text</li> 
     <li class="tdElementEmulation">Some text</li> 
    </ul> 
</div> 

CSS：

.trElementEmulation li { 
    list-style:none; 
    float:left; 
    padding: 5px 10px; 
    border: 1px solid #eee; 
} 

见demo。