Html 使用水平滚动以可变宽度div显示内联块元素

我的布局如下：

在这种特殊情况下，如果div中显示的项目溢出，如何实现水平滚动

我研究过这个问题，我发现一个答案是使用

white-space: nowrap;

---

在container div上，但在我的例子中，这将滚动所有页面。

由于您将元素

200px

定位在左侧，因此可以使用来计算元素的

最大宽度。然后添加
overflow:auto
和
white space:nowrap
以根据子项的数量有条件地添加滚动条：


溢出：自动将在类内工作。但是如果DIV中没有定义的宽度，您将看不到它

这有意义吗

我添加了溢出：自动；但直到我从随机文本中删除空格后，它才起作用

.devices {
    max-width: calc(100% - 200px);
    white-space: nowrap;
    overflow: auto;
}