背景颜色不会延伸到带有滚动条的div框中的可见区域

时间:2011-06-25 04:16:43

标签: javascript html css wiki

[CLOSED]

this page上,有一个div框,其中包含一个代码示例,其中某一行应该被赋予背景颜色。实际上,通过使用正则表达式将开始和结束符号替换为使用红色背景创建div的代码来完成此背景颜色。这很好用,我们有红色背景,正则表达式正在做他们的工作。

但是,如果我们在代码框中滚动一下,我们会注意到红色背景颜色停在代码框的实际边缘处(但我们可以滚动,所以它不是结束)。这应该说明我的意思: Figure One: Our background color terminating before it should be

我几乎尝试过使用firebug可以想到的每个CSS值,包括尝试所有可能的溢出选项。对于宽度,如果我手动给出一个绝对宽度,它可以进一步扩展它,但这不会做,因为背景着色是自动生成的,javascript使用具有良好回退的方法,以防javascript无法加载或被禁用。

那么,有没有人知道如何让这些背景一直延伸到最后?我考虑过对字符进行计数,但由于背景颜色通常覆盖多行,甚至在其他页面上覆盖数百行,因此它似乎不切实际且非常有用。首选CSS方法,但如果它出现,我将使用javascript修复。

如果您想亲自查看页面,请随意,一个只是一个沙箱来显示特定问题,并且使用div元素替换某些注释以创建此背景图像的脚本{{ 3}}

提前感谢您提供任何帮助和/或建议。

1 个答案:

答案 0 :(得分:0)

<pre>overflow:auto不能很好地结合在一起,很可能是你问题的基础。

尝试使用<div>作为滚动容器。

所以:

<div style="overflow: auto">
  <pre>
    ...content...
  </pre>
</div>

而不是

<pre style="overflow: auto">
  ...content...
</pre>