懸停在Internet Explorer中不工作

Question

我試圖使網站兼容> IE8（包括IE）。事實證明，懸停效果不適用於任何IE版本。這是我的網站CLICK

當您導航到頁面「計劃」時，有一個單位的地圖。當你將鼠標懸停在兩個房間之一上時，它會顯示藍色框（在每個瀏覽器中，但不在IE中）。問題是什麼？

這是HTML我使用：

<div id="slide3" class="slide"> 
    <h1>Wybierz swój lokal</h1> 
    <div class="floor-nav"> 
     <ul> 
      <li><a href="#floor0" class="floor-active">0</a></li> 
      <li><a href="#floor1" class="floor-inactive">+1</a></li> 
     </ul> 
    </div> 
    <div id="floor-0" class="floor"> 
     <img src="img/floor-0.png" /> 
     <a href="#" target="_blank" id="flat-1" class="flat"> 
      <span class="flat-desc">Lokal <span class="bold">45m²</span></span> 
     </a> 
     <a href="#" target="_blank" id="flat-2" class="flat"> 
      <span class="flat-desc">Lokal <span class="bold">25m²</span></span> 
     </a> 
    </div> 
</div> 

而且一些CSS：

.flat{ 
    background:none; 
    position:absolute; 
    display:block; 
    color:#ffffff; 
    text-align:center; 
    font-size:30px; 
    text-decoration:none; 
    z-index:900; 
} 

.flat .flat-desc{ 
    display:none; 
    padding-left:38px; 
    background:url(../img/plus-sign-white.png) left top no-repeat; 
    line-height:20px; 
} 

.flat:hover{ 
    background:url(../img/flat-hover-bg.png); 
} 

.flat:hover .flat-desc{ 
    display:inline; 
} 

你有任何想法，爲什麼會出現這種情況？

Answer 1

我無法找到這個問題。但是我發現了一個適合我的解決方案。嘗試

.flat{ 
    position:absolute; 
    display:block; 
    color:#ffffff; 
    text-align:center; 
    font-size:30px; 
    text-decoration:none; 
    z-index:900; 
    background-image: url(add url to a transparent pixel.png or a transparent pixel.gif); 
} 

工作LIVE PREVIEW

新代碼：

.flat{ 
    position:absolute; 
    display:block; 
    color:#ffffff; 
    text-align:center; 
    font-size:30px; 
    text-decoration:none; 
    z-index:900; 
    background-image: url(../img/flat-bg.png); 
}