在使用下一个列之前，如何使文本使用整个第一列？

Question

我在CSS中使用多列布局将一些文本分成两列。像CSS这样的接缝试图保持两列中文本行的数量相同，但我希望在文本继续进入第二列之前将整个第一列用完。我已尝试设置容器的高度，但这没有任何区别。

有没有办法用纯CSS实现这个目标？也许解决方案是不使用多列布局？

#container {
  column-count:2;
  height: 90vh;
  background:lightblue;
}

<div id="container">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam tincidunt congue turpis. Donec vehicula, nisi at imperdiet pulvinar, risus nibh suscipit sem, a varius ligula ligula ut nibh. Integer diam urna, ullamcorper at fringilla eget, pulvinar non sapien. Curabitur varius ac nisi vitae finibus. Donec congue lorem quis laoreet tempus. Etiam et erat ultrices, porttitor ipsum vitae, congue libero. Praesent laoreet id arcu vitae vehicula.

Proin varius posuere sem eget placerat. Ut et pulvinar nisi. Sed at leo blandit, feugiat enim semper, imperdiet dolor. Quisque mi felis, ultricies et libero non, finibus lacinia mauris. Pellentesque ultricies at purus in luctus. Cras faucibus sed lacus ut semper. Aliquam tempor augue diam, et molestie justo tempus eu. Maecenas vitae elit vitae tortor pretium volutpat.

Fusce convallis ipsum vitae magna bibendum fringilla. Ut bibendum hendrerit massa, vitae egestas sem aliquam sit amet. Sed eu pretium velit, blandit lobortis turpis. Sed at gravida tortor. Sed ut pulvinar nibh. Etiam magna turpis, porttitor sed lacus sit amet, egestas volutpat felis. In ac lectus et tellus posuere rhoncus nec volutpat leo. Nulla porttitor dui non velit pulvinar feugiat. Sed ultrices eleifend urna. In at lectus quam. Mauris fringilla pulvinar arcu, in dapibus purus. Sed semper a massa eu lobortis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Proin tristique nibh id neque sodales, et sodales magna condimentum. Cras pretium et libero eget consectetur.
</div>

JS-小提琴： https://jsfiddle.net/2xv10n3b/6/

预期的行为：

Answer 1

添加column-fill: auto

＆＃13;

＆＃13;

#container {
  column-count:2;
  height: 90vh;
  background:lightblue;
  column-fill: auto;
}

＆＃13;

<div id="container">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam tincidunt congue turpis. Donec vehicula, nisi at imperdiet pulvinar, risus nibh suscipit sem, a varius ligula ligula ut nibh. Integer diam urna, ullamcorper at fringilla eget, pulvinar non sapien. Curabitur varius ac nisi vitae finibus. Donec congue lorem quis laoreet tempus. Etiam et erat ultrices, porttitor ipsum vitae, congue libero. Praesent laoreet id arcu vitae vehicula.

</div>

＆＃13;

＆＃13;

＆＃13;