CSS overflow-x和white-space效果无法在Firefox上运行（但在Chrome上运行）

Question

我有一个表，其中一列有一长串文本。我希望这个列是一个固定的小宽度，并有一个水平滚动条。为此，我在长列中使用以下样式：

.foo { 
    white-space: nowrap;
    max-width: 400px;
    overflow-x:scroll;
}

这是一个工作示例： jsfiddle.net/7Ld6c0vv

在Chrome中，一切都很顺利。但是在Firefox中，没有滚动条，列中的文本超出了列边界。

我使用谷歌浏览器版本47.0.2526.73和Firefox 42.0。

如何对其进行修改，以便Chrome中的效果也出现在Firefox中？

Answer 1

这适用于您：https://jsfiddle.net/7Ld6c0vv/2/？

使用td中包含的<div class="foo">：

<td><div class="foo">lhaoh oah ohgoa ngoa nhoganho gaoh goahg oaehgo eoghaogh aog aoghj aohg oehgo hegohao goah goeahgo aewhog haeoghaeo ghoae wgoiawhoeh ofhaioeh oag</div></td>