如何强制表宽度等于其子td宽度，并允许表超出视口宽度

Question

我有一个动态行+列的表。

<table>
  <tr>
    <td>column 1</td>
    <td>column 2</td>
    <td>column 3</td>
  </tr>
  <tr>
    <td>11</td>
    <td>12</td>
    <td>13</td>
  </tr>
  <tr>
    <td>21</td>
    <td>22</td>
    <td>23</td>
  </tr>
</table>

我想让td宽度始终等于其内容。此时，表格宽度根据td宽度扩展。但是，一旦列数增加，总表宽度就会受到页面宽度的限制。

我正在尝试找到一种方法来维护自动td宽度，但允许表格扩展到页面宽度以外。我附上了一个简单的图纸，说明了我的意思：

提前致谢！

Answer 1

添加此样式：

table {
  white-space: nowrap;  //prevent wrapping
}

Fiddle