html - displaying vertical scrollbar in my code -

i going through code in html document , came across following code code samples getting inserted. here code referring to.

 <div class="api-content-item" data-ng-show="verb.code != undefined">     <h5>code samples:</h5>     <ul class="example-lang">       <li data-ng-repeat="ex in verb.code">         <a data-ng-click="examplecode(ex.uri, $parent.$index)">           {{ex.lang}}         </a>       </li>     </ul>     <div class="document-clear"></div>     <div hljs         data-line source="verb.examplecodedata"         class="doc-code-example"         data-ng-init="examplecode(verb.code[0].uri, $index)"></div>  </div> 

the problem that, code doesn't have vertical scrollbar horizontal scrollbar. instance, if have 400 lines of code display on html document, consuming lot of space , showing code don't want.

is there thing in angular js can include vertical scrollbar in above code? please advise. thanks

when use following css:

.doc-code-example {     overflow-x: scroll;     /*max-height:60%;     overflow-y:scroll;*/     background: #fff;     /*overflow: -moz-scrollbars-vertical;*/   } 

the scrollbars scenario following: :

however, when use following css,

.doc-code-example {     /*overflow-x: scroll;*/     max-height:60%;     overflow-y:scroll;     background: #fff;     overflow: -moz-scrollbars-vertical;   } 

the scroll bar looks following : vertical impression gets created , horizontal scroll bar changes it's color still exists. wondering what's going wrong?

this simple css issue.

in class .api-content item, set max-height e.g.

 max-height:60%; 

and set overflow-y scroll

 overflow-y: scroll;  overflow-x:hidden; 

that should it. if add these lines in html rather div, vertical scroll apply everywhere , not particular div.

add

 overflow: -moz-scrollbars-vertical;  

for ff support