多列列表中的项目边距相等

Question

我有一个很长的列表，我希望以多列模式显示。为简单起见，我们每个项目只有一行。我希望物品均匀分布并与顶部对齐。如果项目周围没有边距，则此方法可以正常工作。

但是，我想补充一些空间。唉，使用保证金：

ul {-webkit-column-count: 3; column-count: 3; -moz-column-count: 3; list-style-type: none} li { margin: 5px} 打破顶部对齐：

我找到的唯一解决方案是使用li {border: 5px solid white} 这解决了Firefox的问题，但是Safari打破了边界（对我来说这看起来像个错误）：

是否有适用于所有流行浏览器的解决方案？

我的示例代码在此处：https://jsfiddle.net/L59y0d06/