2列布局，具有不均匀的列长度和文本换行

Question

有没有办法创建一个2列布局，其中一个div在另一个结束后流畅地扩展？

有点像这张图片：

Answer 1

您在寻找this吗？

看看

.container {display: inline-block; width: 100%} /* SET CONTAINER */
.col1 {width: 100%;  border: 1px solid red} /* COL1  */
.col1 span {float: right; border: 1px solid red} /* SET FLOAT:RIGHT TO CONTENT OF YOU WANT TO FLOAT */

Answer 2

如果容器上有纯色背景，您可以尝试使用box-shadow。

#right {
  float:right;
  width:20%;
  width:20vw;
  border:red solid 3px;
  height:50%;
  box-shadow: 0 0 0 20px white,
    -13px 10px 0 10px blue,
    -13px 13px 0 10px blue 
}

http://codepen.io/gc-nomade/pen/HKEpo