如何使文本水平溢出（保持在同一行）

Question

我无法使表格单元格水平滚动。这里是我迄今为止

<tbody> 
    <tr> 
    <td>01/01/14</td> 
    <td> 
     <div class="scroll"> 
     A really long text that will overflow horizontally 
     </div> 
    </td> 
    </tr> 
</tbody> 

和滚动CSS

.scroll{ 
    height: 20px 
    max-width: 500px 
    overflow-x: scroll 
    overflow-y: hidden 
} 

现在不管我怎么努力，细胞就不会溢出水平。它是垂直的，但不是我想要的。任何想法为什么这不起作用？

感谢

Answer 1

你错过了分号;在你的风格规则的结束。此外，请添加white-space: nowrap，以便所有内容都保持在一行并继续向右。

Live demo (click).

.scroll { 
    height: 20px; 
    max-width: 500px; 
    overflow-x: scroll; 
    white-space: nowrap; 
} 

在我的演示中，我改变了height到40px。 20px似乎很小，看到的文字。你可能不需要overflow-y。