在Firefox中，父项不会增加滚动条宽度

Question

当Child指定父溢出的宽度：auto时，Firefox不允许空间增加滚动条的宽度（15px），这会使Child被切断并且溢出-x出现在父节点。

解决此问题的最佳方法是什么？

https://codepen.io/rhysyg03/pen/wrKQJG

.content {
  position: absolute;
  overflow-y: auto;
  min-width:150px;
  max-height: 300px;
  padding: 8px;
  background:white;
  border:1px solid rgba(0,0,0,.12);
}

例如，添加padding-right：15px修复了这个问题，但随后另一个浏览器又增加了15px。

或者为父修正问题添加一个固定的宽度，但是你必然会受到固定宽度的限制，我想让Parent保持灵活性。

或者添加overflow-x：hidden会隐藏滚动条，但会将Child切断。

更新：显示：flex on Parent修复常规宽度（即：图像）的问题，但不修复带有空格的文本设置的宽度：nowrap。

感谢。

火狐：

铬：

Answer 1

你可以使用@-moz-document来编写一些样式，只有firefox可以识别。看到这个：https://developer.mozilla.org/en-US/docs/Web/CSS/@document。

希望对你有所帮助。