Overflow-y: scrolling does not work for chrome

I do not get the scroll bar for the window in chrome, but I get in fire fox and internet explorer

li.box{ border-radius: 0px; padding:0; border: solid 1px #8c8d8e; overflow: hidden; overflow-y:scroll; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-color: #ffffff; opacity: 0.85; } 

this is the JSFiddle link http://jsfiddle.net/wydsf2vk/

+5
source share
6 answers

Add a height property to your css class to display the scroll bar needed to set the correction height of your div.

+4
source

Do you accidentally use a track instead of a mouse on OSX? There's some kind of quirk where the scrollbar will be hidden if you use the track. Plug in the mouse and see if it appears.

+2
source

I just checked your fiddle, what happens because you did not add the overflow-y: scroll; property overflow-y: scroll; to the violin. It works for my version (Chrome too).

http://jsfiddle.net/y8jqsya4/

0
source

change your css: -

 height:100px border-radius: 0px; padding:0; border: solid 1px #8c8d8e; overflow: hidden; overflow-y:scroll; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-color: #ffffff; opacity: 0.85; 

http://jsfiddle.net/wydsf2vk/2/

0
source

Set max-height for this .box, it will work

0
source

You are missing the CSS height . Check out the picture below.

 .box { border-radius: 0px; padding:0; border: solid 1px #8c8d8e; overflow: hidden; overflow-y:scroll; height: 100px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-color: #ffffff; opacity: 0.85; } 
 <div class="box"> <p> Hello World 1 </p> <p> Hello World 2 </p> <p> Hello World 3 </p> <p> Hello World 4 </p> <p> Hello World 5 </p> </div> 
0
source

Source: https://habr.com/ru/post/1202421/


All Articles