/* CSS・スタイルシート質問スレッド【18】 */

以下のようなソースで複数の画像を一つの画像のように見せたいのですが
Opera7だときちんとmargin無しで表示されるのですが
IE6だと各リストの間に隙間があいてしまいます。
IEもしくはOperaのバグでしょうか？

どうすればIEでも隙間が開かないようにできますか？

<ul class="edit">
<li><img src="img/edit01.png" width="230" height="16" alt="edit01.png" /></li>
<li><img src="img/edit02.png" width="230" height="16" alt="edit02.png" /></li>
<li><img src="img/edit03.png" width="230" height="16" alt="edit03.png" /></li>
<li><img src="img/edit04.png" width="230" height="16" alt="edit04.png" /></li>
</ul>

.edit li {
margin: 0;
list-style-type: none;
}

>>232
不思議マークアップの匂いがぷんぷんするが……

line-height : 1; padding: 0; でもだめ？

>>232
なぜにリスト？？？

>>233
.edit li {
line-height: 1;
margin: 0;
padding: 0;
list-style-type: none;
}

でやってみましたが、だめでした。

>>234
ソフトウェアの説明しているページを作っているのですが、
ドロップダウンリストの説明をしようと思ってまして
リストを画像で説明したかったので、各リストを画像に分けて
画像にリンクを貼って<dt><dd>を使って説明している部分に
ジャンプさせたいと思っています。

>>235
そうじゃなく、なんでリストなんか使って並べるのってこと

>>235
それならば、<li>使わなくても<div>とかのブロック要素に
marginをとって、display:list-item;でリストboxを生成したら？
こんな感じで
div {
margin-left:20px;
display:list-item;
list-style-type:square;
}

>>235
それだったら普通に1つの画像＆クリッカブルマップの方が良いような

>>232
font-size: 1px （ピクセル数はてきとう）
を追加するとくっつくね