overflow-y: scroll not working, showing style but cannot be scrolled?

Question

my code is simple like this:

.list {
    margin: auto;
    height: 285px;
    width: 300px;
    overflow-y: scroll;
}

<div class="list">
  <ul>
    <li>hello world</li>
    <li>hello jupiter</li>
    <li>hello mars</li>
  </ul>
</div>

it shows style of a scroll on the side but lacking that scroll you use to move up and down?

Answer 1

You can get it by reducing height like following

.list {
  margin: auto;
  height: 70px;  /* Reduse height */
  width: 300px;
  overflow-y: scroll;
}

<div class="list">
  <ul>
    <li> hello world </li>
    <li> hello jupiter </li>
    <li> hello mars </li>
  </ul>
</div>