2010-10-17 296 views
1

當前試圖創建與背景圖像,懸停和活動階段的最佳錨點。這是我現在所擁有的。它在所有瀏覽器中都能正常工作,除非在IE中按下跨度(15px左側正常工作,因爲它是錨點)。這裏是例子link text。有任何想法嗎?我想保留當前的代碼,沒有絕對,沒有JavaScript。我可以將CSS屬性添加爲span:active或focus,但這樣不能更改錨點的背景位置。IE懸停/焦點/活動錨點和跨度,沒有javascript

下面是HTML代碼:

<a href="#" title="Lorem ipsum noster"><span>Lorem ipsum noster</span></a> 

這裏是CSS代碼:

a {float: left; padding-left: 15px; background: url(i.png) no-repeat -285px 0; text-decoration: none; color: grey; cursor: pointer; overflow: hidden} 
a span {float: left; height: 24px; line-height: 22px; padding-right: 30px; white-space: nowrap; background: url(i.png) no-repeat 100% 0; margin-right: -15px;} 
a:hover {color: black} 
a:active, a:focus {background-position: -285px 1px; color: red;} 
a:active span, a:focus span {background-position: 100% 1px; color: red; line-height: 24px;} 

讓我們來看看你知道什麼:)

回答

0

看起來IE不理解規則的孩子一個元素:active。 但是,您可以應用此僞類<span>這將在IE> 7

我在尋找一個問題的IE < 8 ^^

工作