問題タブ [html-lists]

li.button の高さは固定です。

div#mainの z-index は 0 です

li.button ulの z-index は 100 です。

しかし、ブラウザには表示されません... Firebugはそこにあることを示していますが、表示されていません。

左にテキストがあり、その中の各liの画像がliの右側にある順序付きリストが必要です。そこで、画像を右に浮かせて、画像を右に、テキストを左に正しく配置しましたが、IE と FF では画像が 14 ピクセル低すぎます。クロムはそれを正しく行います。これは、IE と FF がフロートを本来あるべき場所 (Chrome など) の内側ではなく、各 LI の外側または下に配置しているように見えます。IE と FF の位置を -14px (上) に調整すると、問題なく動作しますが、Chrome が台無しになります。14px は各 LI の高さであるため、そのトリックが機能します。

絶対に必要な場合を除き、ブラウザーのハッキングは 1 回もしたくありません (つまり、IE/FF の -14px オフセットを実行し、Chrome にそれを無視するように指示します)。

li について特別なことは何もありません:

最初の LI には FF/IE の画像がなく (#2 のように見えます)、#25 の画像はリストの一番下にあるため、参照してください。

3つすべてをChromeのように見せたい. OL/LI を生成する JavaScript がいくつかあり、これはclass=removeTeamjQuery アクション専用です。このリストは jQuery ソート可能内にあり、jQuery ( .disableSelection();) でリスト選択を無効にしています。これは単純な CSS であり、jQuery や JavaScript とは何の関係もないと思います。

リスト内の LI 項目が残りの LI 項目から移動されているように見える、次の問題があります。

誰かが同様の問題に直面しましたか? うまくいった解決策/ハックはありますか?

<ul>と<li>タグで作成されたメニューがあります。セクション間に小さなセパレータを配置したい。セパレーターについては、背景色と短い高さをに設定するだけ<li>です。非常に見栄えがします...IE7を除いて、同じ内の<li>他のすべてのsよりも高さを短くすることを拒否しているようです。セパレータの高さ（高さ、行の高さ、フォントサイズ）に影響を与えるさまざまな方法を試しましたが、成功しませんでした。<li><ul><li>

IE 7でセパレーターの高さをそのままにして背景全体に色を付ける修正がありますが、それは実際には私が望む外観ではありません（セパレーターが大きすぎます）。<li>タグの高さを制御する別の方法を誰かが考えることができますか？

これがサンプルです-IE8で互換表示を切り替えると、問題が表示されます。

幅320pxのdivがあります。それぞれ幅 100px のリスト アイテムを左側にフローティングさせています。次に、各リスト項目の右側に 10px の右マージンを設定します。他のすべてのマージンとパディングは削除されています。

したがって、次の行に進む前に、基本的に行ごとに 3 つのリスト項目が必要です。しかし、3 番目の項目 (つまり、すべての項目) に右マージンがあるため、次の行に移動します (1 行に 2 項目のみ)。

追加のクラスを作成したり、スクリプトを使用したりせずに、このインスタンスで行ごとに 3 つの項目を持つ方法はありますか?

私は次のマークアップを持っています、

は<li>少し大きく、左側に小さな画像があります。実際にをクリックして<a>リンクをアクティブにする必要があります。<li>リンクをアクティブ化するためにクリックするにはどうすればよいですか？

編集1：

箇条書きの LI のように見えるレイアウトを作成しようとしていますが、LI を使用していません。同じリスト内の異なるアイテムに異なる箇条書きイメージを持たせたいので、LI を使用できません。そして、私が言えることから、LI の箇条書きのスタイルは UL でしか設定できないため、同じ UL 内のすべての LI は同じ箇条書きのイメージを持つ必要があります...そして私はそれを望んでいません。LI のスタイル設定方法について間違っている場合は、訂正してください。

これは、LI の弾丸を再作成するためにスタイルを設定しようとしている HTML です。

次の目標を達成するための最善の方法がわかりません。

• 項目テキストボックスの左側に箇条書き画像を表示して、テキストが多い場合に箇条書きが左余白にぶら下がるようにします。テキストは箇条書きの画像の下に折り返されるべきではありません。
• ブレット画像をテキストの最初の行の中央に配置します (テキストの折り返しの場合)。また、テキストのサイズが変更されたときに箇条書きの中央を揃えます。

私の高レベルの目標は、Web ページでTaskPaper のUIを再作成することです。

私が一番気に入っているソリューションを持っている人に無料のライセンスを喜んで与えます。

ありがとう、

ジェシー

HTML リストにセマンティックキャプションを提供する適切な方法は何ですか? たとえば、次のリストには「タイトル」/「キャプション」があります。

フルーツ

• アップル
• 梨
• オレンジ

リスト自体に意味的に関連付けられるように、「果物」という単語をどのように処理する必要がありますか?