1

> IE8（IEを含む）と互換性のあるWebサイトを作成しようとしています。どのIEバージョンでもホバー効果が機能していないことがわかりました。これが私のウェブサイトですクリック

「計画」ページに移動すると、フラットの地図が表示されます。2つの部屋のいずれかにカーソルを合わせると、青いボックスが表示されます（すべてのブラウザーで表示されますが、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;
}

なぜこれが起こっているのか、何か考えがありますか？

4

1 に答える 1

5

この問題を見つけることができませんでした。しかし、私は私と一緒に働く修正を見つけました。試す

.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 );
}

ワーキングライブプレビュー

新しいコード：

.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);
}
于 2012-10-01T02:11:00.080 に答える