我使用标准HTML表格显示了一些表格数据。我可以根据数据类型预测一下单元格宽度，但不多（名称可能很长，描述可能只有一个单词）：
+--------------+--------------+-----+------+----------------------------------------------+
| name surname | name surname | num | date | one or two sentences making up a description |
+--------------+--------------+-----+------+----------------------------------------------+
现在这个数据也应该在Android智能手机和其他小型设备上可读。问题是即使字体非常小，结果表也比屏幕宽。您可以在这个小提琴中看到问题：http://jsfiddle.net/orithena/nbbaU/4/（如果需要，在宽屏幕上调整结果窗口的大小）。
如果表溢出到右边，我希望行分成两行，而一个单元格跨越两行 - 如果一行一起流动，每行应该这样做（甚至是表头行）。我希望这些“双行”之间有更宽的边界间距，这样用户就可以通过视觉提示将它们解释为“一行”：
+==============+======+======================+
| name surname | num | one or two sentences |
+--------------+------+ making up a |
| name surname | date | description |
+==============+======+======================+
这是一个期望结果的模型，但它是丑陋的标记（辅助单元格，语义单元格顺序对于屏幕阅读器来说是混乱的） - 它是静态的，即必须在服务器端完成：http://jsfiddle.net/orithena/wwCYU/4/
有没有办法在不重新排序细胞或使用辅助细胞的情况下实现流动的细胞表？最好不要在每个表格单元格中使用div，也不要使用Javascript / jQuery？我认为媒体查询是可以的，尽管他们没有完全解决问题。
我甚至没有在网上找到问题，但也许我只是使用了错误的关键字......（哦，它不一定是IE兼容的）。