私はそれにいくつかの要素があるリストを作った。イメージの整列の問題
少なくとも1つの画像を追加しようとすると、画像を除いてすべてが正しく表示されます。imgタグの代わりにdivを使用できますが、その画像は常にサイズ変更する必要があります。
今、この4カップルの時間であったと私はちょうどこれを引き起こしているかを把握することはできませんIv'e、ここに私のコードは次のとおりです。http://jsfiddle.net/QwcG5/1/私はいくつかのいずれかが私を助けることができると思います:)
フィドルやデモを見ます：
フィドル：http://jsfiddle.net/QwcG5/13/
デモ：http://jsfiddle.net/QwcG5/13/embedded/result/
は、私は全体のレイアウト流体を設定して、それは、Liの両方が存在respectivになります次の行に列を中断されませんe <li>のみ。
注：構造の変更はありません。
これは、いくつかのピクセルのウィンドウのサイズを変更するとすぐに破損します。 –
縦方向を追加：中間;それはOKです。 http://jsfiddle.net/QwcG5/16/ 私はまた、李さんと別のULで全体を囲むと、これらのdiv
<div class="verify_list_block">1</div>
を交換することをお勧め。そのようにきれいに思える。
<li class="verify_list_item">
<ul class="info">
<li class="verify_list_block">1</li>
<li class="verify_list_block">3</li>
<li class="verify_list_block">4</li>
<li class="verify_list_block">5</li>
</ul>
</li>
私は構造を変更していません。あなたのフィドルhttp://jsfiddle.net/QwcG5/16/私たちがズームインしたりズームアウトしたりするとき、div（列）が別の行に分割されています。 – w3uiguru
私のレイアウトは比較的柔軟です：スペースが足りない場合、アイテムは次の行に移動します。あなたのことで起こることは、すべてが底に向かってシフトしていることです。あなたはvertical-align：topを使っています。あなたは垂直方向の整列を使用する必要があります。 .- –
期待どおりの結果ですか？ – Zeta
@ゼータ私はそれがイメージを含む最初のものと同じ行にあるべきであることは、かなり明白なブロックだと思う、あなたはどのように右のボーダーがたくさんダウンしたのか見ることができます。 – Linas
私の答えを見て、問題がある場合は私に聞かせてください、これはあなたの必要条件ではありません。変更が必要な場合は指定してください。 – w3uiguru