将display: flex;添加到您的css中的#people ID：

#people{
  display: flex;
 -webkit-column-count: 4; /* Chrome, Safari, Opera */
 -moz-column-count: 4; /* Firefox */
 column-count: 4;
 -webkit-column-gap:.5em;
 -moz-column-gap:.5em;
 column-gap:.5em;
 padding-bottom:2px;
 font-size:18px;
 line-height:21px;
}

.keeptogether{
  display:inline-block;
  width:100%;
}

个字符
希望有帮助

将display:inline-block替换为display:block。
根据caniuse的说法，对于Chrome问题，您应该在容器上添加-webkit-perspective:1;。

#people{
 -webkit-column-count:4;
 -moz-column-count:4;
 column-count:4;
 -webkit-column-gap:.5em;
 -moz-column-gap:.5em;
 column-gap:.5em;
 padding-bottom:2px;
 font-size:18px;
 line-height:21px;
 -webkit-perspective:1;
}

.keeptogether{
  display:block;
  width:100%
}

个字符

如果您将display: flex;添加到#people ID，那么它在所有浏览器中都可以正常工作，并且您不需要.keeptogether类的display:inline-block;。
你可以查看代码片段：

#people {
 -webkit-column-count:4;
 -moz-column-count:4;
 column-count:4;
 -webkit-column-gap:.5em;
 -moz-column-gap:.5em;
 column-gap:.5em;
 display: flex;
 padding-bottom:2px;
 font-size:18px;
 line-height:21px;
}

.keeptogether {
  width:100%
}

个字符
希望能帮上忙。

为什么需要给予display: inline-block？使用column属性的概念是将整个给定的内容划分为等宽列。因此，如果删除inner-div，所有内容将正确对齐到给定的列数中。
如果从当前代码中删除inline-block，这也可以工作。

#people {
  -webkit-column-count: 4;
  -moz-column-count: 4;
  column-count: 4;
  -webkit-column-gap: .5em;
  -moz-column-gap: .5em;
  column-gap: .5em;
  padding-bottom: 2px;
  font-size: 18px;
  line-height: 21px;
}


/* you don't need this property
.keeptogether {
  display: inline-block;
  width: 100%;
}
*/

个字符

我在一个WordPress主题中使用了类似的方法。它在Firefox中看起来相当不错，在Chromium/Chrome中显示两列而不是四列，以实现全屏宽度。
当我增加了每页的文章数量（砖块）时，列的数量增加了，以填满空间。
Chrome似乎会在进入下一列之前渲染三个或更多的砖块。

在Chrome 80.0遇到这个问题后，解决方案来自对这个问题的评论：

.childbrick {
    break-inside: avoid-column;
}

字符串
这修复了Chrome中奇怪的列缺失以及如果不使用display:inline-block;会发生的列拆分。

评论引用了此解决方案的Firefox问题，但我在Firefox版本73中没有发现此类问题。

从我对这个问题的经验中，我发现-webkit需要放在最后（否则我猜它会尝试使用非webkit并失败）

column-count: 2; 
        -moz-column-count: 2; 
        -webkit-column-count: 2;

字符串

你只需要删除.keeptogether规则，它就可以正常工作了。另外，我建议你总是添加column-width规则，以使它更具响应性，因为该规则设置了每列的最小大小。

#people{
 -webkit-column-count:4;
 -moz-column-count:4;
 column-count:4;
 column-width: 120px;
 -webkit-column-gap:.5em;
 -moz-column-gap:.5em;
 column-gap:.5em;
 padding-bottom:2px;
 font-size:18px;
 line-height:21px;
}

/*.keeptogether{
  display:inline-block;
  width:100%
}*/

个字符