Html 3列表格，宽度：自动，50%，50%，溢出隐藏

我正在尝试在移动网站设计中重新创建每日日程视图。PC版本如下所示：

它将有几行，最多5或6列。我认为一个表格会是最好的，但是我找不到合适的CSS/HTML来让它按照我想要的方式工作

我希望第一列具有自动宽度，以适合内容，其余列相等（均匀分布）。整个桌子的宽度为100%

我可以通过如下设置列宽来实现这一点：0；50%; 50%; -- 不使用

表格布局：固定表格布局：fixed

，它将保持单元格的正确大小，但第一列的宽度为0，而不是auto/fit。我尝试将内容放在span或div中的每个单元格中，并将其设置为：

width:100%；溢出：隐藏，但我认为宽度：100%在一个不固定的表中不起作用

如果我真的需要，我会为第一列设置一个固定的宽度，但我想避免这样做，因为我不想使用固定的字体大小——特别是因为这将是一个移动网站，用于智能手机和平板电脑

我可能可以通过使用嵌套表或浮动来做一些事情。。。第一列不是同一个表的一部分，但我希望有一个超级干净的解决方案我没有，我可以把所有这些都放在一个表中

编辑：根据要求，这里是我尝试过的代码的一个版本。名称前带有x的样式与我尝试过的完全不同（我添加x以快速删除，并轻松放回）：


时间
埃里克
唐娜
早上8点做点什么
9:00AM用更多的文本做一些其他的事情，这样我们就可以看到当文本太长时，它是如何工作的

上面的版本和我得到的一样接近，但是早上9点的“ERIC”的长文本换行成了多行。如果我将其更改为不换行，则单元格会变得太宽（即使有溢出：隐藏）。
您的表格宽度为100%，第二列和第三列的宽度各为50%，第一列的宽度为0%。当然，它不起作用，因为它已经用完了第二列和第三列的100%宽度。
如果一个表不能满足我的要求，下面是一个嵌套表解决方案，它看起来不像我想象的那么糟糕：

<table cellpadding="0" cellspacing="0" style="width: 100%;">
<tr>
<td style="width: 0;">
<table cellpadding="0" cellspacing="0">
<tr><td>Time</td></tr>
<tr><td>8:00am</td></tr>
<tr><td>9:00am</td></tr>
</table>
</td>
<td>
<table cellpadding="0" cellspacing="0" style="width: 100%; table-layout: fixed; white-space: nowrap;">
<tr><td>ERIC</td><td>DONNA</td></tr>
<tr><td style="overflow: hidden;">This cell has a lot of text so that I can test for overflow issues even if I make my browser window very wide</td><td>&nbsp;</td></tr>
<tr><td>&nbsp;</td><td>Whatever</td></tr>
</table>
</td>
</tr>
</table>


时间
上午八点
上午9点
埃里克唐娜
这个单元格有很多文本，所以我可以测试溢出问题，即使我的浏览器窗口很宽
无论什么

小提琴手：
您能出示您的代码吗？添加。我知道这很难看，没有使用CSS/etc，但我现在只是在试验阶段。小提琴1：这是我想要的样子，但没有固定/硬编码的第一列宽度：清理版，以防有人想为我分叉，应该更容易更新：看起来你还没有理解这个问题——OP相当清楚他/她想要什么。
<table cellpadding="0" cellspacing="0" style="width: 100%;">
<tr>
<td style="width: 0;">
<table cellpadding="0" cellspacing="0">
<tr><td>Time</td></tr>
<tr><td>8:00am</td></tr>
<tr><td>9:00am</td></tr>
</table>
</td>
<td>
<table cellpadding="0" cellspacing="0" style="width: 100%; table-layout: fixed; white-space: nowrap;">
<tr><td>ERIC</td><td>DONNA</td></tr>
<tr><td style="overflow: hidden;">This cell has a lot of text so that I can test for overflow issues even if I make my browser window very wide</td><td>&nbsp;</td></tr>
<tr><td>&nbsp;</td><td>Whatever</td></tr>
</table>
</td>
</tr>
</table>