上下に 2 つの DIV レイヤーがあります。上の DIV には画像があり、下の DIV にはテキストのブロックがあります。下部 DIV のテキストの量が変化するため、必要な高さが増減します。下部に必要な高さに基づいて、上部 DIV の画像の高さを動的に減らす必要があります。正確に 600px の垂直方向のスペースが利用可能です。
例: 下の DIV に 200 ピクセルの高さが必要な場合、画像の高さを 400 ピクセルに変更する必要があります。下の DIV に 300 ピクセルの高さが必要な場合は、画像の高さを 300 ピクセルに変更する必要があります。
画像の高さを一番上の DIV の 100% にすることができるので、必要に応じて拡大または縮小できます。問題は、下部の DIV が自由に拡張できるようにする必要があり、それに応じて上部の DIV が反応する必要があることです。つまり、どちらも固定の高さにすることはできません。
<div id="topdiv">
<img src="example.png" alt="This image needs a height based on the bottom div" />
</div>
<div id="bottomdiv">
This text needs to be able to expand or contract freely
</div>
誰でも助けることができますか？