HTML表:仅在需要时在td中水平滚动

Question

我有一张表格如下:

<table  cellpadding="2" cellspacing="0" > 
<tr>
<td>Contact: </td>
<td width="100px"><div style="overflow-x:scroll; width:100px">ee@yahoo.com</div>
</td>
</tr>
</table>

此代码显示电子邮件单元格中的水平滚动.

当电子邮件是一个像ee@yahoo.com这样的短片时,滚动显示但它没有启用,因为它不需要,当电子邮件更长时,让我们说

eeeeeeeeeeeeeeeeeeeeeeeeeee@yahoo.com

滚动启用,以便您可以看到整个电子邮件.

这很好,但我需要的是当电子邮件很短时,滚动不显示.

我怎样才能做到这一点？？

我试过了:

overflow-x:auto;

并且它在短电子邮件时不显示滚动但当电子邮件很长时它只是剪切它根本没有滚动. 我认为这是因为电子邮件中没有空格.

Answer 1

通过定义overflow-x: scroll您指示滚动条无论如何都会出现.

你应该用overflow-x:auto.这是一个工作演示