Css 页面上的两个div类似于列，第一个div填充第二个div之后的所有空间

以下是html代码：

<div id="wrapper">
<div id="ads">...</div>
<div id="content">...</div>
</div>

...
...

我知道如何在页面上放置像列一样的div，但我不知道是否有可能实现内容div在ads div之后填充所有空间？ 一个明显的解决方案是将ads div放入content div中，如下面的答案所示。但有一个问题。contentdiv可以包括任何其他html代码，而不仅仅是纯文本。例如，如果我将内部div放在样式为“width:100%”的地方，100%表示内容div的所有宽度，那么它就不会注意ads-div。 我想把两个div分开是不可能做到这一点的。 请参见演示的屏幕截图：

---

现在浮动页面上的元素无助于实现这一点，如果需要，可以使用

display:flex



或者，如果您想支持遗留浏览器，请考虑使用<代码>显示：表；<代码>和
分别显示：表格单元格


我尝试过这个，但不是通过div，但我在我的案例中使用了段落和div

你也可以试试这个

<div id="wrapper">
  <div id="content">
  <div id="ads">...</div>
  <p>
  //your content
  </p>
  </div>
</div>

检查（）

您可以根据需要获得填充或边距
您可以重新安排元素，使广告位于内容内
。例如，见：

<div id="wrapper">
    <div id="content">
        <div id="ads">...</div>
        Lorem ipsum ...
    </div>
</div>

您需要将
放入您的
中

以下是全部代码：

HTML:

或者只看一下fiddle。
IMO如果没有部分内容重叠，这是不可能的。内容区域不能有两种不同的宽度。我猜他想拉相邻的容器，比如如果a的高度更高，拉b元素，如果b的高度更高，拉a元素，但我不知道有没有可能实现内容div在广告后填满所有空间div@Mr.Alien-看着OP的第二张照片，我猜他想让内容“环绕”广告（比内容短）。他还说：“（…）content div填充了ads div之后的所有空间”让我们看看，如果是这样的话，那么解决方案是非常简单的，但是在读了这一行之后，我想不出有没有可能实现content div填充ads div之后的所有空间：）现在我有了类似于你答案中的html标记。但有一个问题。contentdiv可以包括任何其他html代码，而不仅仅是纯文本。例如，如果我将内部div放在样式为“width:100%”的地方，100%表示内容div的所有宽度，它不需要注意ads-div。很抱歉我的英文不好。@ifeelgood-请参阅如何处理（使用
右边距
等于ads div的宽度）。
<div id="wrapper">
  <div id="content">
  <div id="ads">...</div>
  <p>
  //your content
  </p>
  </div>
</div>

#ads{
float:right
width:200px;
}

<div id="wrapper">
    <div id="content">
        <div id="ads">...</div>
        Lorem ipsum ...
    </div>
</div>

#ads {
    width: 100px;
    height: 200px;
    background-color: red;
    float: right;
}
#content {
    width: 100%;
    height: 100%;
    background-color: yellow;
}

<div id="wrapper">
<div id="content"><div id="ads">...</div>
</div>

    #content {
           width:600px;
           height:500px;
           background-color:red;
    }

    #ads {
            height: 300px;
            width:100px;
            background-color:blue;
            float:right;
    }