使浮动div填充剩余空间

Question

如何让left div填充剩余空间？一般来说，我想要完成的是将右侧div设置为右侧并使用左侧div填充剩余空间。

<div>
  <div id="left" style="float: left"></div>
  <div id="right" style="float: right; max-width: 700px"></div>
</div>

Answer 1

这是你在找什么？

#container {
  display: flex;
  width: 100%;
}

#left {
  background-color: red;
  flex-grow: 1;
}

#right {
  max-width: 700px;
  background-color: blue;
}

<div id="container">
  <div id="left">
    Left left left
  </div>
  <div id="right">
    Right right right
  </div>
</div>

以下是css flexbox https://css-tricks.com/snippets/css/a-guide-to-flexbox/

的指南