Html 保持动态创建的

我正在创建web应用程序，我被卡住了，所以我需要你的帮助。 所以，用户可以手动创建出现在容器中的列表，一切正常，直到无序列表的数量超过容器的宽度，然后这些列表开始显示在已经创建的列表下，但我希望它们始终位于容器的顶部，当用户需要更多空间来存储所有列表时，水平滚动条应该出现。我已经放置溢出：自动；在我的容器中，但它只适用于垂直滚动条

<div class="columns columnsPrivate">
   ... some simple unordered lists with couple list items which I append using javascript

</div

所以我的问题是，如何强制那些无序列表出现在“columns”类的顶部，当我说在顶部时，我指的是位置：relative:top:0px；，不要将它们放在已经创建的列表下面。

试试看

ul {
    overflow: auto;
    white-space: nowrap;
}

这一个回答是，下次一定要做更多的研究：

---

使用overflow-x:auto；对于水平滚动条。

这对我不起作用，因为我的无序列表表示列，列表项表示行，所以每一列都必须在列表项下的另一列和列表项旁边，但在其父项内。所以我很容易做到这一点，但当我添加另一列时，它会在其他列和行的下面，实际上它是有效的，似乎我有了float:left；这就是它不起作用的方式。非常感谢。