滚动条不起作用

时间:2014-01-02 03:16:51

标签: html css css3 scrollbar

下面是我的html文件,

<div class="col-xs-6 col-sm-3 my1" id="qwer1" role="navigation">        <!--Change is made here-->
          <div class="menuBar">
            <ul class="menuList" id="menuList">
              <li><a href="#">Update 1</a></li>
              <li><a href="#">Update 1</a></li>
              <li><a href="#">Update 1</a></li>
              <li><a href="#">Update 1</a></li>
              <li><a href="#">Update 1</a></li>
              <li><a href="#">Update 1</a></li>
              <li><a href="#">Update 1</a></li>
              <hr>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
              <li><a href="#">Chat 1</a></li>
            </ul>
          </div><!--/.well -->
        </div><!--/span-->

以下是css文件,

.my1
{
    position:fixed;
    left:78%;
    border-left:1px solid black;
    border-bottom:1px solid black;
    width:20%;
    top:14%;
    height:auto;
    overflow:scroll;
    scroll-face-color:red;
}

html文件的内容远远不是sreen,但是当滚动条无法操作时。此外,我已将滚动条的颜色指定为红色,但颜色效果似乎也不起作用。以下是浏览器的屏幕截图

enter image description here

如何激活此滚动条? 提前谢谢。

2 个答案:

答案 0 :(得分:4)

问题是你指定了:

height:auto;

.my1规则下,div将根据内容的需要扩展高度。

如果您已修复高度,则会激活滚动条。

请参阅演示:http://jsfiddle.net/audetwebdesign/myPZB/

就尝试设置滚动条的颜色样式而言,感兴趣的属性是:

scrollbar-face-color

我认为目前只支持IE浏览器。

参考:http://msdn.microsoft.com/en-us/library/ie/ms531157%28v=vs.85%29.aspx

答案 1 :(得分:2)

height:50%

尝试这个..我测试好了..如果'自动',滚动不起作用