html - Firefox の位置: 期待される結果を絶対に返さない

Question

Web ページの画像にラベルを重ねたい。position: absolute をラベルに使用し、float: left を img に使用すると、テストしたすべてのブラウザー (Firefox (3 および 4) 以外) で動作するようになりました。

html は基本的に次のようになります。

<h3>Header</h3>

<div class="wrapper">   
    <span class="img-title">OVERLAY LABEL</span>    
    <img src="pic.jpg">
    <div class="text">
        <p>Some text about the lovely picture goes here</p>
    </div>
</div>

<p>Footer bits</p>

そしてCSS：

.wrapper { 
    overflow: auto; 
}
.img-title { 
    position: absolute; 
}
img { 
    float: left; 
}

position:absolute に関して、Firefox が Chrome、IE、Safari、Opera とは異なる動作をする理由を教えてもらえますか?

ここに問題の私のjfiddleがありますか?