웹킷 스크롤바를 만드는 방법-표시

내 HTML GUI에서는 3 섹션입니다 .---

• 가로로 맨 위 (의 클래스 div는 scrollable--- & ---의 ID는 div입니다 Images)
• 수직 왼쪽 (클래스 div인 scrollableMenu의 --- & --- ID div입니다 menu)

• 중앙 지역 (class of divis scrollableCenter--- & --- ID of divis center)

  1. button-1을 누르면 내 jQuery 코드 (숨기기 / 표시 방법 사용)가 Div scrollableMenu에 class-1의 7 개의 입력 유형 이미지를 표시합니다.
  2. button-2를 눌렀을 때 내 jQuery 코드 (숨기기 / 표시 방법 사용)는 Div scrollableMenu에 class-2의 8 개의 입력 유형 이미지를 표시합니다.
  3. button-3을 누르면 내 jQuery 코드 (숨기기 / 표시 방법 사용)가 Div scrollableMenu에 클래스 3의 3 가지 입력 유형 이미지를 표시합니다.
  4. button-4를 누르면 내 jQuery 코드 (숨기기 / 표시 방법 사용)가 Div scrollableMenu에 class-1의 4 개의 입력 유형 이미지를 표시합니다.

현재 저는 DIV scrollableMenu를 따라 수직으로 아래쪽으로 실행되는 웹킷 스크롤바 만 있습니다.
내 요구 사항에 따라 즉, div scrollableMenu에 대해 수직으로 아래쪽으로 실행되는 웹킷 스크롤바 만 필요합니다.

내가 직면 한 문제 는 3 & 4의 경우 웹킷 스크롤바가 보이지 않는 것입니다.

입력 유형 이미지의 수가 적더라도 수직으로 아래로 실행되는 내 webkit-scrollbar-track이 계속 표시 될 수 있습니까?
적어도 내 webkit-scrollbar-track을 표시하려면 어떤 속성을 추가해야 합니까?

GUI보기 :

=========================================================

 Button-1   Button-2   Button-3    Button-4  Button-5

=========================================================
                 ||
                 ||
                 ||
      DIV        ||
 scrollableMenu  ||
                 ||
                 ||
                 ||
                 ||
                 ||
=========================================================

CSS :

div.scrollable {
    margin: 0;
    padding: 0;
    overflow: auto;
    padding-left: 4px;
    padding-top: 20px;
    box-sizing:border-box;
}

div.scrollableMenu {
    margin: 0;
    padding: 0;
    overflow: auto;
    padding-left: 4px;
    padding-top: 20px;
    box-sizing:border-box;
}

div.scrollableCenter {
    margin: 0;
    padding: 0;
    overflow: auto;
    padding-left: 4px;
    padding-top: 20px;
    box-sizing:border-box;
}

#images {
    background-color:#888686;
    white-space:nowrap;
}

#Menu {
    background-color:#292B3B;
    position:absolute;
    top:115px;
    bottom:20px;
    left:0;
    width:250px;
}
#center {
    background-color:#292B3B;
    position:absolute;
    top:115px;
    left:250px;
    right:0px;
    bottom:20px;
}


::-webkit-scrollbar-track {
      background-color: #DDDFED;
      border-radius: 20px;

}

::-webkit-scrollbar {
    background-color: #DDDFED;
    width: 10px;
    height: 10px;
} 

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
      background-color: #CCC9DA;
}