阻止浮动 HTML 元素下降到下一行

Stop Floating HTML elements from dropping to the next line

本文关键字：一行 HTML 元素更新时间：2023-09-26

我正在构建一个网站，该网站旨在显示许多动态数量的div元素（每个元素都有自己的宽度），但它们不是沿着页面向下移动，而是水平移动。但是，当项目数的组合宽度大于容器div 时，它会自动下降到下一行。有没有办法阻止这种情况发生，并允许水平滚动（通过脚本而不是溢出栏）？

不要浮动它们，而是将它们设置为 display:inline-block; 。将包含元素设置为 overflow:hidden; ，然后您可以使用脚本通过多种方式滚动它们，例如调整第一个元素的边距，或将它们包装在另一个元素中并更改 left 属性（如果遵循此路线，则需要设置position）。

编辑：您还需要设置white-space:nowrap

看到这个工作小提琴：http://jsfiddle.net/D8bea/