楽天RMSだと、ロールオーバー用のjavascriptって使えないじゃないですか。

しょうがないから、cssで背景化して、background-positionで
1枚の画像の位置を変える という、よくあるやり方をやろうとしたら、

IEでうまくいかない。
IE6,7,8,9で全部でうまくいかない。

調べてみたら、
background-positionはhover前もhoverあとも、絶対値で指定しないとだめなんだって。

楽天の場合。

よくやるやり方はこうだと思う↓

.menu1 a{background:url(img/menu1.gif)  no-repeat left top;}
.menu1 a:hover{background:url(img/menu1.gif)  no-repeat left bottom;}

menu1.gifという1枚の画像をマウスを乗せることによって、bottomを見せるというやり方。

ところが、楽天だとこれがエラーになる。
(なんでなのかはわからない)

なので、下のようにやる

.menu1 a{background:url(img/menu1.gif)  no-repeat 0px 0px;}
.menu1 a:hover{background:url(img/menu1.gif)  no-repeat 0px -20px;} 

 
一応書いたやつを全部のせておきます。

#globalmenu li{float:left;}
#globalmenu li a{
text-indent:-9999em;
overflow:hidden;
font-size:10px;
display:block;
height:59px;
}

#globalmenu li.menu1 a{background:url(http://www.rakuten.ne.jp/gold/**/img/common/gmenu1.png) no-repeat ;width:60px;}
#globalmenu li.menu2 a{background:url(http://www.rakuten.ne.jp/gold/**/img/common/gmenu2.png) no-repeat ;width:59px;}
#globalmenu li.menu3 a{background:url(http://www.rakuten.ne.jp/gold/**/img/common/gmenu3.png) no-repeat ;width:75px;}
#globalmenu li.menu4 a{background:url(http://www.rakuten.ne.jp/gold/**/img/common/gmenu4.png) no-repeat ;width:129px;}
#globalmenu li.menu5 a{background:url(http://www.rakuten.ne.jp/gold/**/img/common/gmenu5.png) no-repeat;width:115px;}
#globalmenu li.menu6 a{background:url(http://www.rakuten.ne.jp/gold/**/img/common/gmenu6.png) no-repeat;width:118px;}

#globalmenu li a{background-position:0px 0px !important;}
#globalmenu li a:hover{background-position:0px -74px !important;}