Question

我有overflow-y:auto;这个div，它可以非常窄，当滚动条出现时，它可以覆盖大部分或全部div。我希望滚动条显示在div之外，就像overflow:scroll;一样，但是当没有溢出时我不想看到褪色的滚动条。另外我不想给div一个宽度，因为宽度必须是可变的。这个jsfiddle演示了我的问题，这是代码：

   .auto {
            display:inline-block;
            border:1px solid green;
            height:70px; 
            overflow-y:auto; 
         }

<div class = "auto">
  <div>
    a<br>
    b<br>
    c<br>
    d<br>
  </div>
</div>

Answer 1

将18px填充权交给.auto类，它会对你有所帮助。

   .auto   {
       border:1px solid green;
       height:70px; 
       overflow-y:auto; 
       display:inline-block;
       padding-right:18px;
      }

Answer 2

这可能是一个解决方案：http://jsfiddle.net/ZUYVe/5/

基本上，它使用包装器来包含滚动条

<div class="scroll">
  <div>a
    <br />b
    <br />c
    <br />d
    <br />
  </div>
</div>

并在右侧留出一些空间：

padding-right: 13px;

但是，由于滚动条可能因操作系统而异，我建议使用自定义滚动条，例如this jQuery plugin。

Answer 3

fiddle为其添加最小宽度和最大宽度。这样它就会保持variable

停止滚动条覆盖div内容与自动溢出

3 个答案: