[解決済み] divが残りの幅を埋めるようにする

質問

divが残りの幅を埋めるようにするにはどうしたらいいですか？

<div id="Main" style="width: 500px;">
    <div id="div1" style="width: 100px;"></div>
    <div id="div2"></div>
    <div id="div3" style="width: 100px; float: right;"></div>
</div>

どうすれば div2 を埋めてください。

どのように解決するのですか？

こんな感じで試してみてください。

<style>
    #divMain { width: 500px; }
    #left-div { width: 100px; float: left; background-color: #fcc; }
    #middle-div { margin-left: 100px; margin-right: 100px; background-color: #cfc; }
    #right-div { width: 100px; float: right; background-color: #ccf; }
</style>

<div id="divMain">
    <div id="left-div">
        left div
    </div>
    <div id="right-div">
        right div
    </div>
    <div id="middle-div">
        middle div<br />bit taller
    </div>
</div>

div は自然にコンテナの100%の幅を取るので、この幅を明示的に設定する必要はありません。2 つのサイド div と同じ左右のマージンを追加することで、それ自身のコンテンツがそれらの間に収まるように強制されます。

真ん中のdiv"は、次のようになることに注意してください。 後 HTMLのquot;right div"です。