Javascript / Html停止文本环绕

Question

我的目标是将行输出到网页中的文本框。有些线很长。太长而不适合的线条会导致滚动条显示为必要。

如果字符串太长，它会在文本框中环绕而不是溢出到右边并打开滚动条。

Html：

<pre class="form-group" style="border:1px solid black;overflow:scroll;height:200px;width:100px">
    This is a lot of text foo foo foo foo foo foo foo foo foo foo foo foo foo foo foo
</pre>

此处的宽度设置为100px以进行演示，但必须在应用程序中将其设置为100％的全宽。如何阻止这些包装？

Answer 1

使用white-space-n：nowrap属性修复了我的项目的问题。 Webber和spencerLarry发布的JSFiddles在我的特定项目之外工作正常。

Answer 2

如果您想阻止文字换行，请使用overflow: scroll !important;

如果样式存在冲突，!important会强制溢出状态。

Answer 3

你几乎做对了。

尝试使用css：

overflow-x: auto;

此链接显示：

JSFiddle