submitボタンをCSS+Javascriptでロールオーバー

HTML

<input type="submit" class="btn" onmouseover="this.style.backgroundImage='url(images/btn_on.gif)'" onmouseout="this.style.backgroundImage='url(images/btn.gif)'" />

CSS

input.btn{
width:100px;
height:100px;
background:url(images/btn.gif) no-repeat;
border:none;
cursor:pointer;
overflow:hidden;
padding-top:100px;
}

text-indent:-9999px;で指定してもいいんだけど、なぜかIEで見えなくなっちゃう。ボタンごと枠外にふっとんでるみたい。なのでpadding指定。overflow:hidden;にしてるので一応は見えないけど、あんまりスマートじゃないなあ。というか誰かいい方法知ってたらおしえてください！