当文本超过高度时Textarea背景图像滚动

【问题标题】：Textarea background image scrolls when text exceeds the height当文本超过高度时Textarea背景图像滚动
【发布时间】：2010-06-15 10:47:02
【问题描述】：

我正在尝试解决 IE7 中的问题。

我的文本区域后面有一个背景图像，当文本超过文本区域的高度时，它会随着文本滚动并开始随着文本滚动。

有人知道为什么会发生这种情况以及解决方案是什么吗？

谢谢，詹姆斯

【问题讨论】：

【解决方案1】：

这是一个仅在 IE 6 和 7 中出现的问题，已在 IE8 中解决。

要解决此问题，请尝试将包装在 <div> 中。将 <textarea> 的背景和边框属性应用到 <div>，然后将 <textarea> 的边框和背景设置为无。 <p>您可能仍需要调整 </p> <div> 和 <textarea> 的边距和内边距以使其看起来恰到好处，但现在您应该指向正确的方向。

【讨论】：

【解决方案2】：

您是否尝试将background-position 设置为background-position: top center;？
（或类似background-position: 50px center;。）

【讨论】：

【解决方案3】：

使用：

textarea { background: transparent url(/images/test-bg.jpg) no-repeat top left; width: 500px; height: 230px; }

应该给你一个固定在textarea框左上角的背景图片，当文本超过初始尺寸时，它会被固定。

【讨论】：