javascript - 如何将文本从 DIV 流向 DIV？

Question

我有两个 DIV，它们分别位于 HTML 页面的两侧，例如 ( EXAMPLE )

<div class="left">
</div>
<div class="right">
</div>

使用 CSS

.left{
    position:absolute;
    left:10px;
    top:10px;
    width:100px;
    height:100px;
    background:red;
}
.right{
    position:absolute;
    right:10px;
    top:10px;
    width:100px;
    height:100px;
    background:blue;
}

有没有一种方法可以将文本添加到左侧 DIV 并将多余的文本流到右侧？我并不拘泥于这两个 DIV，我只是在寻找一种解决方案，将多余的文本转移到另一个位置。

注意:我希望找到一个纯 CSS 的解决方案，尽管这似乎不太可能；然后，我正在寻找一个 pure javascript 解决方案(不使用 JS 库)。

Answer 1

CSS Regions (仍然是一个“草案”，但是)旨在解决这个问题:

The CSS regions module allows content to flow across multiple areas called regions. The regions are not necessarily contiguous in the document order. The CSS regions module provides an advanced content flow mechanism, which can be combined with positioning schemes as defined by other CSS modules such as the Multi-Column Module [CSS3COL] or the Grid Layout Module [CSS3-GRID-LAYOUT] to position the regions where content flows.

更多信息和教程，请访问 https://www.adobe.com/devnet/archive/html5/articles/css3-regions.html