html - divを垂直にフロート

Question

divを垂直にフロートさせる方法は? div の上に空のスペースがある場合は、上に移動してスペースを埋め、下部に空のスペースを残す必要があります。

 float:left // for floating horizontally

固定幅で固定高さではなく水平方向に浮動している多くの div があります。隙間を空けずに並べてほしい。

これはどのように行うことができますか？

Answer 1

div は、それ自体の上に空のスペースを残すことはありません。スペースがいっぱいになり、ドキュメントが一番下に移動します。

私は、ある種のpaddingまたはmarginそこにあると思います。

次のように、divに絶対位置を与えることができます。

div {
position: absolute;
top: 0;
}

このように、div はページのほぼ上部に配置されます。他の要素を重ねて、 を与えるtopような形で に何らかの価値を与えることができますmargin-top。

お役に立てば幸いです。

Answer 2

次の問題が発生していると仮定しましょう: 高さが異なるいくつかの div が複数の行に次々と存在します。たとえば、最初の行に非常に背の高いものがあり、2 番目の行のすべての div をより深く「潜らせる」ように強制します。現時点では、この外観を大幅に改善するためのクロスブラウザーの純粋な css の方法はないと強く感じています。ただし、少なくとも何かを達成することができます

 display:inline-block;
 vertical-align:top 

それ以外の

float:left. 

次のようになります。

http://jsfiddle.net/wHTQ2/

見栄えの良いものが必要な場合は、この質問を参照してください: css float elements with unequal heights left and up in grid 探しているものと同じだと思います。残念ながら、純粋な CSS でできることはあまりありません。