使用列计数（CSS/HTML）时出现错误的滚动条

当使用column count:2时，如果出现溢出，我希望显示一个垂直滚动条，但会显示一个水平滚动条。如果没有列计数，垂直滚动条将按预期显示。如何使用列计数：2并显示垂直滚动条

.searchCriteriaPanel {
    border-radius: 0 0 5px 5px;
    width: 300px;
    height: 200px;
    background-color: lightgrey;
    padding: 10px;
    overflow-y: auto;
    column-count: 2;
}

<div id="MarketContent" class="searchCriteriaPanel">
    <label><input type="checkbox">one</label><br />
    <label><input type="checkbox">two</label><br />
    <label><input type="checkbox">three</label><br />
    <label><input type="checkbox">four</label><br />
    <label><input type="checkbox">five</label><br />
    <label><input type="checkbox">six</label><br />
    <label><input type="checkbox">seven</label><br />
    <label><input type="checkbox">eight</label><br />
    <label><input type="checkbox">nine</label><br />
    <label><input type="checkbox">ten</label><br />
    <label><input type="checkbox">eleven</label><br />
    <label><input type="checkbox">twelve</label><br />
    <label><input type="checkbox">thirteen</label><br />
    <label><input type="checkbox">fourteen</label><br />
    <label><input type="checkbox">fifteen</label><br />
    <label><input type="checkbox">sixteen</label><br />
    <label><input type="checkbox">seventeen</label><br />
    <label><input type="checkbox">eighteen</label><br />
    <label><input type="checkbox">nineteen</label><br />
    <label><input type="checkbox">twenty</label><br />
    <label><input type="checkbox">twentyone</label><br />
    <label><input type="checkbox">twentytwo</label>
</div>

.searchCriteriaPanel{
边界半径：0 0 5px 5px；
宽度：300px；
高度：200px；
背景颜色：浅灰色；
填充：10px；
溢出y：自动；
列数：2；
}
一个

两个

三个

四个

五个

六个

七个

八个

九个

十个

十一个

十二个

十三个

十四个

十五个

十六个

十七个

十八个

十九个

二十个

二十一岁

二十二

---

您是否尝试过使用溢出控制包装列并在包装上设置高度，例如：

---

这种行为的原因是，您正在使用固定的

宽度
和
高度
限制该元素的大小。
要获得预期效果，请在其周围放置一个包装器元素，并将宽度和高度设置移动到此包装器。然后，您将获得所需的怒视行为：

.wrapper {
      width: 300px;
      height: 200px;
      overflow: auto;
}
.searchCriteriaPanel {
      border-radius: 0 0 5px 5px;
      background-color: lightgrey;
      padding: 10px;
      column-count: 2;
}

完整的解决方案：很抱歉，它已被更正。如果我正确理解你的问题，现在应该可以了。“twentyone”和“twentytwo”只有在向右滚动时才可见，而所有数字都是通过向下滚动显示的。这似乎对我来说仍然不起作用。我没有看到任何滚动条。也许我有缓存问题。对不起，今天早上我遇到了相同的解决方案。天哪，我觉得这真像是一种恶作剧。不怪你。真的是在责怪CSS/HTML。我不知道为什么我不能指定宽度、高度、列数，并通过垂直滚动条进行额外显示。不幸的是，这会影响我的总宽度，我在这个上面/下面还有其他div没有多个列，使用这个解决方案，我必须修改这个div的宽度以与其他div对齐。我很感激你的时间，所以我会把它标记为一个解决方案，但我真的不喜欢它。再说一遍，不是你的错。
.wrapper {
      width: 300px;
      height: 200px;
      overflow: auto;
}
.searchCriteriaPanel {
      border-radius: 0 0 5px 5px;
      background-color: lightgrey;
      padding: 10px;
      column-count: 2;
}