css - 一个液体 div 和一个固定大小的 div

Question

我正在尝试构建一个具有固定宽度 div 和旁边的液体宽度 div 的布局：

<div id="main" style="width:100%; height:500px; background-color: #ccc;">
    <div id="right" style="float: right; width:100px; height:500px; background-color: red;">
    </div>
    <div id="left" style="float: right; width: auto; height:500px; background-color: orange;">
    </div>
</div>

左 div 没有填充它的宽度，当右 div 不存在时，我也希望这个 div 填充整个主 div，我该怎么做？

Answer 1

我觉得你想要的更像

<div id="main" ... >
  <div id="right" style="float: right; width: 100px;"> Will take up 100 px </div>
  <div id="left" style="margin-right: 100px;"> Will take up the rest </div>
</div>