如果达到最大高度，则CSS会中断到新列，并允许宽度适合内容

Question

是否只有在达到最大高度时才能使列中断至新列，还允许width:fit-content。 我的问题是我想构建一个大型菜单，其中的项目列表会拆分为一个新列。

如果您查看此代码段，将会发现width:fit-content被忽略了。

我基本上需要能够设置一个max-height，如果列表流过它，请中断到新列，但要扩展宽度以满足此要求。

我该如何实现？

.menu {
  display:flex;
}

.menu ul {
  background-color:lightgray;
  height:80px;
  display:flex;
  flex-flow: column wrap;
  width:fit-content;
}

<div class="menu">
  <ul>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
    <li>Item 1</li>
  </ul>
</div>