No.1ベストアンサー
- 回答日時:
chromeでも、list-style-imageは問題なく表示されるようです。
考えられる原因は、marginやpaddingのマイナス指定、
liタグのdisplay:inline、画像パスの指定ミスなどがありそうです。
ちなみに以下の指定だとどのように表示されるでしょうか。
li{
margin:3em;
padding:3em;
list-style-image: url(hoge.gif);
border:1px solid #f00;
}
<ul>
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
また、list-style-imageは、現在のブラウザ実装状況では、
表示位置がずれたり、ずれた位置を調整する機能がなかったり不便なことが多いため、
背景画像で代用するケースが多いようです。
http://css.hp-advance.com/category/p_6.html
この回答への補足
list-style-position:inside ;
で、画像が枠内表示され、意図する結果になりました。
ありがとうございました!!!!
アドバイスありがとうございます。
li{
margin:3em;
padding:3em;
list-style-image: url(hoge.gif);
border:1px solid #f00;
}
と記載してアップすると IE では赤枠内に画像が表示されるのですが、
chromeでは赤枠外に画像が表示されてしまいます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS アコーディオンメニューが思うように動作しません。 1 2023/08/20 16:48
- Chrome(クローム) 【Google】「同期は有効です」と表示されているがブックマークが同期されていない 2 2022/11/17 13:32
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- Firefox(ファイヤーフォックス) Firefoxが起動しない原因とカイゼン方法 2 2022/07/19 10:54
- Chrome(クローム) WINDOWS7でGoogle Chromeを使い続けるには? 5 2022/12/09 15:54
- Chrome(クローム) Google ChromeでカーソルあわせるとURLが左下に表示されるようになってしまいました、非表 1 2022/05/08 17:13
- CPU・メモリ・マザーボード タスクマネージャーでのアプリの稼働についての質問です。 2 2023/06/14 12:58
- JavaScript アップロードファイルの種類によって処理を分岐させたいのですが書き方が分からずアドバイスお願いします 4 2023/06/17 19:12
- Chrome(クローム) 「タブ」が多数表示される。 1 2022/08/23 15:32
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
リストマーカーをボックス内に...
-
<table>の高さ固定。情報増加時...
-
html/cssの、navを2段にする...
-
番号付きリスト(<Ol><Li>・・...
-
html <li>の中の文字一部に色を...
-
ol要素の番号とリスト項目の離...
-
htmlの<ol>タグで、数字などを...
-
画像横のテキストをセンターに...
-
レスポンシブWebデザインでリン...
-
HTMLで組織図を作成する方法
-
「・」(黒い点)を非表示にした...
-
CSS「table-cell」で横並びにし...
-
親ページ側からインラインフレ...
-
list-style-type部分だけ大きく...
-
CSS使用。表のセルの中で、強制...
-
CSS3グラデーションで、右端だ...
-
HTMLで画像を3つ並べる方法
-
横並びのボタンの背景を片方だ...
-
カルーセルスライダー「slick.j...
-
ulとliで囲った文字の一部を変...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
リストマーカーをボックス内に...
-
番号付きリスト(<Ol><Li>・・...
-
liタグの中に<p>タグやら<dl>を...
-
レスポンシブWebデザインでリン...
-
<table>の高さ固定。情報増加時...
-
<ul><li></li></ul>にするメリ...
-
リストの数字のフォントサイズ...
-
HTMLで組織図を作成する方法
-
ulタグやliタグの中でbrタグ...
-
divタグ内のコンテンツが重なっ...
-
画像にリンクを張ると画像がず...
-
複数行にまたがる括弧を表示し...
-
ページを開いているときのリン...
-
html <ul></ul>の並びで一行空...
-
html/cssの、navを2段にする...
-
HTML5のfooterに見出しを付けて...
-
<ul>~</ul>が二つ続くと間に改...
-
htmlの<ol>タグで、数字などを...
-
リンク文字同士の間隔を開ける...
-
CSSでつくったメニューのアニメ...
おすすめ情報