CSS精靈在FF12的工作，但不是IE8

這個HTML碼...CSS精靈在FF12的工作，但不是IE8

<a href="LINK" class="testclass"></a>

...作品與這個CCS-代碼...

a.testclass 
    { 
    background: transparent url(sprite.png) no-repeat -125px -671px; 
    display: block; 
    width: 378px; 
    height: 150px; 
    }

...在Firefox 12但不是在Internet Explorer 8中。

代碼受此啓發question regarding anchors, sprites and CSS。我找到了一個similar questions，但由於這段代碼放在一個相當複雜的Drupal安裝中，我仍然希望有一個更簡單的方法來解決這個問題，而不是通過代碼來找到一些「絕對定位的外部div和一些菜單樣式」，這是在2負責這個問題。

感謝您的幫助。

編輯-1：

這是螢火蟲HTML的日誌：

<div id="banner-area"> 
    <div id="banner-left"> 
    <div class="region region-banner-left"> 
     <div> 
     <a href="LINK"> 
      <img width="378" height="150" alt="ALTTEXT" src="IMAGE.GIF"> 
     </a> 
     </div> 
    </div> 
    </div> 
    <div id="banner-right"> 
    <div class="region region-banner-right"> 
     <p> 
     <a class="testclass" href="LINK"></a> 
     </p> 
    </div> 
    </div> 
</div>

引用的CSS-代碼是：

#banner-area { 
    width:756px; 
    margin:0; 
    padding:0; 
    overflow:hidden; 
} 

#banner-left { 
    width:378px; 
    float:left; 
    margin:0; 
    padding:0; 
} 

#banner-right { 
    width:378px; 
    float:right; 
    margin:0; 
    padding:0; 
}

的第一張照片（Image.gif的）顯示在FF和IE8中。第二個，我想用精靈來代替的，只在FF中顯示，而在IE8中沒有顯示。

我已經按照Florian的建議打開和關閉了透明度，但沒有任何效果。我將寬度和高度的圖像尺寸縮小了10px，但這也沒有幫助。

來源

2012-06-04 MiBerG

你能多給點信息嗎？！應該在IE8中工作，除了「透明」聲明。你有沒有嘗試刪除這一個？ –

我已經添加了一些更多的細節。我已經檢查了它在沒有「透明」聲明的情況下的外觀，但這並沒有幫助。 – MiBerG

後的時間浪費兩天，我已經發現，IE8不會導入超過31 CSS-文件：http://drupal.org/node/228818?page=1

在Drupal的管理面板再次啓用「優化CSS-文件」功能包括後我的安裝，我已關閉，所以它不會干擾我的發展，一切工作正常。

來源

2012-06-07 16:29:15 MiBerG

所以更改您的代碼：

a.testclass 
{ 
    background: url(sprite.png) no-repeat -125px -671px; 
    display: block; 
    width: 378px; 
    height: 150px; 
}

，如果你真的需要擦除背景顏色（因此將其設置爲透明）嘗試其他設置，如

a.testclass 
{ 
    background-color: transparent; 
}

但是，IE8不喜歡，所以要注意有一些修復包括IE8。

來源

2012-06-04 15:47:10

CSS精靈在FF12的工作，但不是IE8

回答

相關問題