問題が発生しましたが、解決策が見つかりませんでした。これは非常に単純な要件だと思っていたので、かなり混乱しています。
次の要素があります。
画面の解像度に応じて、画面の右側 (div#A の隣) に 1、2、3、n 列の画像が表示されます。これの代わりに、コンテナ #B はコンテナ #A の下に配置され、ウィンドウの全幅を使用します。
私の別の試みは、#B に float:right と margin-left (#A の幅よりも大きい) を与えることでしたが、これもうまくいきませんでした。
周囲のラッパーの高さがそのコンテンツとともに増加する必要があるため、絶対配置を避けたいと思います。
私が話していることを視覚化するために、次の図を作成しました: http://abload.de/img/rezeptbilder1k8lsr.png
よろしくお願いします！
これが起こっているのはdiv#B..たくさんの画像があり、それらが隣り合って配置されているため...ansの幅が動的になっているためです...したがって、最終的にdiv＃Bは100％の幅に成長します... 100% 幅の場合、div#A の下に到着します。100% + div#A の幅が 100% ワイド画面に収まらないためです..わかりますか???
1 番目の解決策 :: を使用できますwidth:calc(100% - div#a's width)。div#a 以外の残りの空き領域に等しい div#ba 幅が得られます
またはoverflow:hidden、div#B で使用することもできます...最初に、この div は最終的に画像の 1 行で残りの空き領域の幅を取り、幅が 100% になると画像の別の行を作成します..しかし、このためには、ラッパー**overflow:auto;**も..で修正する必要があります..overflow:auto;ラッパーでは、div AとBの組み合わせが100％を超えるとスクロールバーが導入されます
編集 :: CALC() のブラウザー サポートを確認してください。
注::あなたが私たちにあなたの試みを提供した場合、私たちの提案はより適切になります
コードを提供していないため、実際に解決策を提供することはできません。（そうしてください）
そうは言っても...説明と画像に基づいて、div#Aとdiv#Bのフロートが壊れています。これの最も一般的な理由は、幅が div#wrapper (フローティング要素の包含要素または親要素) の幅の 100% を超えていることです。
フロートは常に 100% 等しくなる必要があります (100% 未満でも機能しますが、どこかに余分なスペースがあるなど)。
たとえば... 幅が 100 ピクセルの #wrapper がある場合、幅が 50 ピクセルと 50 ピクセル、または 30 ピクセルと 70 ピクセルの 2 つの div を内部に持つことができます。
それで...なぜあなたのは壊れているのですか？動的な幅の要素と静的な幅の要素を混在させようとしているからだと思います。フロートは、このようなことを行うように設計されたことはありません。それを達成するにはさまざまな方法がありますが、どの方法を使用するかは、私が持っていないコードによって異なります。
壊れている他の考えられる理由は、マージンスペースが多すぎる、パディングが多すぎる、または div の境界線でさえあります。要素の幅には、デフォルトで、パディング、マージン、ボーダーの幅が含まれます。幅 100 ピクセルの div があり、左右に 10 ピクセルのパディングがあり、全体に 2 ピクセルの境界線がある場合 (両側に 2 ピクセル)。次に、合計幅が 124px の div があります。
