0

絶対に配置されたhtmlの束と、その後に表示されるはずのhtmlスニペットがあります。しかし、彼らはオーバーラップします。

http://jsbin.com/okamot/1/edit

下のものはすべて.drag-drop絶対配置することになっているので、 の高さと幅は.drag-dropゼロになります。展示ボタンと展示テキストは、太字の の後に表示されるはずThis is Drag and Drop Itemです。しかし、 の高さ.drag-dropが 0 であるため、.drag-drop` のコンテンツの真上に表示されます。

私は以前にこの問題を抱えていましたが、幸いなことにの子の高さを計算するのは簡単だったので、JavaScriptを使用して.drag-drop高さを設定しました。.drag-drop今回は、より多くの子が含まれており、それらが一定ではないため、より困難です。Exhibit がドラッグドロップの下に表示されるように css を変更するにはどうすればよいですか?

4

2 に答える 2

1

絶対配置では要素がレイアウトから削除されるため、子は親のサイズ設定の計算に含まれなくなります。これを解決するには、JS を使用する必要があります。

于 2013-07-18T19:50:08.397 に答える
1

最善の方法は、コンテンツを絶対的な位置に配置しないことです。それらを相対的に配置したり、フロートさせたりできますか? それらの位置、高さ、幅などを操作することもできます。それらはレイアウトを持っているため、含まれている div は正しい高さになります。

それらをフロートする場合は、高さを正しく計算するために、含まれている div の下部に「フロート ブレーカー」を追加する必要がある場合があります。 .... <div>some floated content</div> <br style="float: none;"/> // float-breaker right before containing div closes </div>

それ以外の場合は、前の回答者が正しいため、js ハッカーが必要になります。

于 2013-07-18T19:59:18.163 に答える