【】1つのDIV内に2つのDIVを並べて配置します。右側の div のサイズは可変です。 _html/css_WEB-ITnose

写真に示すように:
頭部が div で、左側に画像、右側に背景色 (画像の右側と同じ色) がある Web ページを作成したいです。 , ブラウザのサイズに応じて x を繰り返します。
以下は、左と右という 2 つの div でネストされた #middle div です。左の幅は 200 ピクセルで、右の右端は頭の右端と一致する必要があります。

問題は、右側のものが常に狭く、ページ サイズに適応できないことですか? ? ?

ディスカッションに返信（解決策）

右側の div に div を追加し、内部クラスを追加します

div1{float:left;position:relative;margin-right:-200px;}div2{float:right;width:100%;}div2 .inner{margin-left:200px;}

http://jsfiddle.net/jikeytang/b75z9/2/
インターネット速度早速ですが、開いて見てください。

2L に戻って margin-right:-200px; を追加すると、左側が消えます

「問題は、右側が常に狭くなり、ページ サイズに適応できないことです。???」
左側の幅が固定されている場合、右側は共通コンテナの残りの幅を埋め、ページの幅に応じて調整する必要があります。ページ幅が小さい場合、右側が非常に狭くなります。ページ幅が小さいときに右 div が狭すぎないようにするには、右 div の min-width を定義するか、レスポンシブ レイアウトのメディア クエリを使用して、右または左 div を 1 行ではなく垂直に表示します。 。
以下は単純な 2 列レイアウトの例です。