overflow：scroll和auto

overflow: scroll将隐藏所有溢出的内容并使滚动条出现在相关元素上。如果内容没有溢出，滚动条始终可见，但被禁用。

overflow: auto 非常相似，但滚动条仅在内容溢出时出现

所占空间位置不同

overflow: scroll情况下，内容自动撑开容器的宽度不包括滚动条，相当于滚动条是一个和内容并列显示的组件。
overflow: scroll

而overflow: auto情况下，内容撑开容器的宽度包括滚动条，即使用whitespace: no-wrap;撑开容器至正好显示所有内容时，如果有滚动条，则滚动条会覆盖在内容上方，导致内容宽度再次被缩小，然后出现省略号。由此推测渲染顺序：
自适应宽度 → 根据高度显示滚动条 → 重新计算内部元素宽度
这里不会再次自适应，因此出现了内容显示不全的情况。
overflow: auto

总结一下就是，如果宽度是由内容自适应撑开的，则overflow: auto;带来的滚动条会占用内容的一部分宽度，导致内容显示不全。
作者：寂寞的原子
链接：https://www.jianshu.com/p/1ac2933891cd