2014-01-02 2 views
1

Ниже мой HTML файл,Scrollbar не работает

<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 файла также из скрина, но Eventhough полоса прокрутки является не работает. Более того, я указал цвет полосы прокрутки как красный, но цветовой эффект также не работает. Ниже приведен скриншот браузера,

enter image description here

Как я могу activte этого скроллбара? Спасибо заранее.

ответ

2

Проблема заключается в том, что вы указали:

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

+0

благодаря MARC, полоса прокрутки работала, когда я определил высоту в 500px, но все же я не мог получить цвет «красный». Любые указатели на это? –

+0

для редактирования (Y) –

2
height:50% 

попробовать this..I испытания ok..if 'авто', прокрутка не работает

+0

Да, это сработало, но я все еще не мог получить «красный» цвет ...... –

Смежные вопросы