如何制作一个 div 以适应所有可用的宽度隐藏与滚动？答案

【问题标题】：How to make a div to fit all available width hidden with scroll?如何制作一个 div 以适应所有可用的宽度隐藏与滚动？
【发布时间】：2016-11-30 23:00:50
【问题描述】：

我以前问过这个问题。 Here 是原创帖子。
我们已经找到了解决方案，但我想问一下是否有机会以另一种方式解决这个问题？

原始fiddle 链接与该问题。

有人可以解释为什么带有display:block; 甚至带有dipslay:flex; 或任何其他显示类型（表格除外）的元素不占用宽度，隐藏在滚动下吗？

这让我有点困惑。

【问题讨论】：

因为 window(html) 的宽度是开始时可用的 100% 宽度，所以一个元素可能会溢出，但其他元素只会使用最初的 100% 宽度。显示：表格；的默认值可以扩展，并且其中的任何子块都将填充整个可用宽度，并且不会介意 html 宽度或父级上的水平滚动条

标签： html css

【解决方案1】：

当使用宽度 100% 时，它会想要拉伸到其容器的大小，如果内容多于空间，请尝试添加溢出：滚动；它会添加一个滚动条并尝试将您设置的宽度保持在稳定状态。

.pane .body {
  width: 100%;
  overflow: scroll;
}

【讨论】：