在支持pre-flexbox用户代理(主要是旧IE)的同时，绝对没有办法通过CSS来实现你想要的东西——除非:

您知道每个元素的精确渲染高度(如果是这样，您可以完全定位内容)。如果您正在处理动态生成的内容，那么您就不走运了。 你知道这些元素的确切数量。同样，如果您需要对动态生成的多个内容块执行此操作，那么您就不走运了，特别是当内容块超过三个左右时。

如果以上为真，那么您可以通过对元素的绝对定位来做您想做的事情

#wrapper { position: relative; }
#firstDiv { position: absolute; height: 100px; top: 110px; }
#secondDiv { position: absolute; height: 100px; top: 0; }

同样，如果你不知道至少#firstDiv的高度，你无法通过CSS单独做你想做的事情。如果这些内容是动态的，则必须使用javascript。

或者为元素设置一个绝对位置，并通过从页面的边缘而不是对象的边缘声明页边距来去除页边距。使用%，因为它更适合其他屏幕尺寸等。这就是我如何克服这个问题的……谢谢，希望这是你想要的…

在CSS中，将第一个div向左或向右浮动。第二个div与第一个div一样向左或向右浮动。应用clear:向左或向右，与上面两个div的第二个div相同。

例如:

#firstDiv {
    float: left;
}

#secondDiv {
    float: left;
    clear: left;
}

这个解决方案只使用CSS，并且适用于可变内容

#wrapper   { display: table; }
#firstDiv  { display: table-footer-group; }
#secondDiv { display: table-header-group; }

CSS真的不应该被用来重构HTML后端。然而，如果你知道所涉及的两个元素的高度，并且感觉很笨拙，这是可能的。此外，当在div之间进行时，文本选择将会混乱，但这是因为HTML和CSS的顺序是相反的。

#firstDiv { position: relative; top: YYYpx; height: XXXpx; }
#secondDiv { position: relative; top: -XXXpx; height: YYYpx; }

其中XXX和YYY分别是firstDiv和secondDiv的高度。这将适用于后面的元素，不像顶部的答案。

CSS唯一解决方案 1. 包装的高度应固定或 2. 第二个div的高度应该固定