プロが教える店舗&オフィスのセキュリティ対策術

Wordpressでサイトを製作中です。
http://www.warna.info/archives/1310/comment-page …
↑のサイトのパンくずナビを使用しておりますが、IEでのみ前のページの表示【>】が効かず、表示されません。他のブラウザは大丈夫でした。
ちなみに、
content: ">";
のCSS記述を
background-image:"";
にして【>】の画像を入れてもダメでした。
何でもいいので、前のコンテンツに【>】を入れられる命令を教えていただけませんか。

――――――――――――――
現在のパンくずの状況
home contentsA contentsB

どういう表示にしたいか
home > contentsA > contentsB
――――――――――――――

CSSはコチラです↓

#bread-crumb {
font-size: 95%;
padding: 1px 0 10px;
}

#bread-crumb ul {
margin: 0;
}

#bread-crumb ul:after {
clear: both;
content: ” “;
display: block;
font-size: 0;
height: 0;
visibility: hidden;
}

#bread-crumb li {
float: left;
}

#bread-crumb li.sub {
padding-left: 10px;
}

#bread-crumb li.sub:before {
letter-spacing: 10px;
content: “>”;
}

A 回答 (1件)

IEのバージョンが書かれていないのでわかりませんが、擬似要素とcontentに対応しているか確認してみてください。


 なお、
clear: both;
content: ” “;
display: block;
font-size: 0;
height: 0;
visibility: hidden;
の指定の意味はナンでしょう。表示させないなら無駄なものは書くべきじゃありません。
記事要素に対応していない場合、その子孫要素に継承されるプロパティが継承されてしまいます。font-size,visibiltyは継承されるプロパティです。

<ul>
 <li>あいうえお</li>
 <li>あいうえお</li>
 <li>あいうえお</li>
</ul>
ul li:hover:after{
content:"▼";
}
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!