0

言葉にするのはちょっと難しいので、jsFiddleでそれを示します。

緑色のブロックの 1 つにカーソルを合わせると、その背景が隣接する四角形に「接触」する (余白に重なる) ように十分に拡大する必要がありました。ただし、各行の最後のブロックにカーソルを合わせると、レイアウトが乱れます。下の行には 1 つの要素しか表示されません。

原因は、負のマージンにあるようです。「展開された」クラスのマージンが -5 ではなくプレーンな 0 に設定されている場合、この問題は発生しないためです。しかしもちろん、これはブロック間にスペースを残します。

親コンテナのサイズはこれを変更していないようです。今のところ、展開されたブロックがうまく中央に配置されておらず、その行の他のブロックが少しぐらつくという事実については特に心配していませんが、問題に関連している可能性があります.

4

3 に答える 3

3

拡張機能のパディングを10pxに変更します http://jsfiddle.net/TMXLz/4/

于 2012-07-19T13:27:43.690 に答える
0

あなたが望むことをする唯一の方法は、それらのブロックをあなたが望む場所に絶対的に (position:absolute) 配置することです。ここでの主な問題は、ボックスに加えたい変更によって、ボックスが互いのスペースに侵入することです。したがって、マウスオーバーごとに（jsを使用して）すべての間隔を調整する必要があります（これはひどいです）。または、アイテムを所定の位置に絶対に配置する (ボックスごとに特定の配置スタイル) と、アイテムが部分的に重なる問題は発生しません。アクティブなものの z-index を増やして、常に他のものよりも「上」になるようにしてください。

于 2012-07-19T13:33:34.973 に答える
0

これはあなたが探している出力かもしれません

http://jsfiddle.net/TMXLz/5/

于 2012-07-19T14:33:51.170 に答える