浮动框的方式，但在主块后带有html代码？

Question

我有标准的float: left代码：

<div class="container">
  <div class="float-box" style="float: left"></div>
  <div class="main-div"></div>
</div>

问题是float-box中的html代码太多，所以我希望它位于main-div之后，但是float-box在main-div以下

<div class="container">
  <div class="main-div"></div>
  <div class="float-box" style="float: left"></div> <!-- below -->
</div>

有没有办法在CSS中做到这一点？ 我不想有两列。 float-box应该只占用必需品空间，而不是main-div的高度