html - 背景被剪掉了

Question

我想突出显示 a 中的一些行<div>。
有些线条比宽度长<div>，所以我用<div style="overflow:scroll;">.
但是，当我向右滚动时，突出显示的背景会在右边缘被剪切，因此长于<div>' 宽度的文本没有背景。

<style>
.a { background-color:red; }
.b { background-color:yellow; }
</style>
<div style="overflow:scroll;width:49%;height:100%;border:1px solid silver;white-space:nowrap;">
<pre>
<div class="a">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff
dffdgfdsgfg</div>
<div class="b">asdsad</div>
</pre>
</div>

任何人都可以解决这个问题吗？

Answer 1

删除空格：nowrap；

并添加word-wrap: break-word;

Answer 2

我认为您的问题可能与自动换行有关：这是一篇解释其用法的好文章：http ://webdesignerwall.com/tutorials/word-wrap-force-text-to-wrap

希望能帮助到你，