为什么Firefox解释顶级偏移量与Chrome，Safari和IE不同？

Question

采用以下示例：

这是一个textarea，带有背景图像（灰色条）和textarea之后的相对定位div，顶部偏移可以将文本移动到位。

标记：

<textarea cols="40" rows="6" class="some_textarea">Hello</textarea>
<div class="message_text">This is a message</div>

CSS：

.some_textarea {
  background: transparent url(gray_bar.png) repeat-x 50% 100%;
  width: 99%;
  padding: 5px;
  margin: 0;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 13px;
  border: 1px solid #C3C3C3;
}

.message_text {
  display: inline;
  color: #999;
  font-size: 10px;
  position: relative;
  top: -21px;
  padding: 0 6px;
}

问题是Firefox是唯一不同意偏移的浏览器，导致这个非常小的像素推动烦恼：

造成这种情况的原因是什么？我如何解决这个问题以保持一致性？如果无法修复，会出现哪些非笨重的变通办法？

Answer 1

更新

http://jsfiddle.net/UnsungHero97/maHkr/7/

---

这样的事情怎么样......

http://jsfiddle.net/UnsungHero97/maHkr/2/

我所做的是将textarea / message组合包装在相对定位的div中，然后将消息绝对定位到左下角。您可以使用精确的定位/边距/填充进行游戏，以使其在浏览器中看起来很好。

我希望这会有所帮助 赫里斯托斯

Answer 2

使用jQuery（window）.load（）而不是jQuery（document）.ready（）