0

私はこの問題をウェブ上でばかげた回数見ましたが、これまでのところすべてがベースになっています<li><a>Test</a></li>

私がやろうとしていることは、単純に次のとおりです。

<ul>
<li class="title">Test</li>
<li>Test2</li> ** These should float together on the same line **
<li class="title clear">Test</li> ** New Line **
<li>Test2</li>
</ul>

これは、リスト要素を別々の行に配置するIE6以外のすべてで問題なく機能します。

このjsFiddleはここで見つけることができます:http://jsfiddle.net/pjWdg/

IE6でエラーを確認してください。他のすべてのブラウザは、正常に動作します。

私はもう試した:

ul, ul li {
    list-style: none;
    padding:0px;
    margin:0px;
}

.clear {
   clear: both;
}

li.title {
   width: 200px;
}

ul > li {
    float: left;
}

私も試しました:

ul > li {
    display: inline;
}

成功しませんでした。誰かが私がこの仕事をする方法に光を当てることができますか?ありがとうございました!

** アップデート **

リストスタイルの>を削除すると、次のようになります。

http://jsfiddle.net/pjWdg/1/

Test2がTest3の隣に表示されているので、これが間違っていることがわかりますか?

4

2 に答える 2

3

IE6は子セレクターをサポートしていません>

ul li代わりに、liをターゲットにするために使用します。

于 2012-10-05T10:55:04.813 に答える
1

スタイルシートでこれらの変更を試してください。

ul, ul li {
list-style: none;
padding:0px;
margin:0px;
}

.clear {
clear: both; 
}

li.title {
 width: 200px;
  float:left;

}
于 2012-10-05T11:23:16.227 に答える