2011-04-23 47 views
0

例:http://jsfiddle.net/9BygQ/5/CSS僞活躍:爲什麼不會:活躍的背景位置移動不會在IE中工作?

如果您在Chrome測試的例子,你會看到在:積極的按鈕顯示爲按下爲什麼似乎並主動僞狀態並不在IE什麼影響?

這個問題已經困擾了我現在一段時間...

愛一些幫助!

乾杯

+1

你可能想看看這個http://stackoverflow.com/questions/5594102/active-css-selector-not-working-for-ie8-and-ie9 – BoltClock 2011-04-23 15:44:01

回答

0

這裏的至少一個提示:

你可能已經看到,在IE瀏覽器:主動觸發按鈕的右側。即10px的填充右區域。因此,雖然您的<span>高於您的<a>,但IE會激活:懸停但不是:激活。 (我可能是錯的,我發現這個問題只能通過點擊無處不在:))

所以我試圖扭轉<a><span>,它幾乎可以工作(仍然有像右側的一個問題)

這裏新代碼

HTML <a><span>SEXY BUTTON</a></span></a>

CSS span a{ background:url('http://thebeer.co/imgs/UI/sprite.png') right -548px no-repeat; padding-right:10px; color:#CCC; font-size:12px;} 

span{width:200px;display:block;background:url('http://thebeer.co/imgs/UI/sprite.png') -1348px -475px no-repeat; padding:10px 11px; padding-right:2px; text-align:center; font-family:medium; text-transform:uppercase; letter-spacing:1px;} 

a:hover{color:#F97216;} 
a:active{background-position:right -584px; color:#666; cursor:pointer;} 
a:active > span {background-position:-1348px -511px ;} 

我不知道這將解決你的問題,但我希望這將有助於:)