アイコンを背景画像svgで表示したいです。
IE11では表示されたのですが、Chrome、firefoxでは真っ白でした。
[html]
<ul class="btnlist"> <li><a href="#" class="btn_fav hover"><i class="img_svg"></i>お気に入り</a></li> <li><a href="#" class="btn_point hover"><i class="img_svg"></i>ポイント管理</a></li> </ul>
[sass]
.btn_fav{ i{ display: inline-block; width: 14px; height: 16px; margin-right: 4px; vertical-align: middle; background-image: url(../img/ico_fav.svg); } } .btn_point { i{ display: inline-block; width: 18px; height: 14px; margin-right: 4px; vertical-align: middle; background-image: url(../img/ico_point.svg); } } .img_svg{ display: block; white-space: nowrap; overflow: hidden; text-indent: 100%; background: 50% 50% no-repeat; }
原因、対策がわからず困っています。
ご教授いただけたら幸いです。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/06/09 02:58
2018/06/09 03:23