html/CSS を使用して、2 つの画像を含む小さな div を、中央に配置された (l/r マージンが自動に設定された) 垂直方向に伸縮性のある大きな中央の右下の外側に配置しようとしていますが、幅 400 ピクセルの div にはたくさんのものがあります。必要なものを正確に取得できないようです。
ウィンドウが広すぎる場合、緑のボックスが赤いボックスのすぐ隣に留まり、空のスペースが両方のボックスの右側に行くように、私が取得しようとしているものは次のとおりです。ウィンドウの幅が十分でない場合、ユーザーは右にスクロールして緑色のボックスを表示する必要があります。
これに対する非常に簡単な解決策が欠けているように感じます。フロートは、緑のボックスを右いっぱいに揃え、緑と赤の間に空のスペースを配置するため、機能しません。さまざまな「位置」の CSS 配置を試しましたが、赤いボックスの外側に緑のボックスを配置するのに苦労しました。
編集（詳細が要求されました）：
赤枠(#main)は相対位置、緑(#sub)は絶対位置にしてみました。さまざまな left:px、right:px 座標をいじってみましたが、赤いボックスの外に出すと見えなくなることがわかりました。position タグと align タグの組み合わせをいろいろ試してみました。私はインラインブロックを試しました（ここで関連性があるかどうかさえわかりません!）。
次に、ダミーのラッパーの親 div の作成について何かを読んでいたので、それを試みて #wrapper を作成し、位置の相対/絶対を実験しようとしましたが、赤いブロックの上のレイアウトを台無しにしてしまいました (実際には単なるバナーです)。および h1)。
投稿する実際のコードがなくて申し訳ありませんが、何かを試してうまくいかないたびにタグを削除したので、この余分な CSS と混同しませんでした。私はこの小さなことに数日間取り組んできました。現在、私のコードは以前の試行から少し残っています。
#main {width:400px;
margin-left: auto;
margin-right: auto;
padding-bottom:0px;
overflow:hidden;}
#sub {right:-10px;
bottom:100px;
float:right;}