0

I added code to remove vertical scroll bar from the entire scope of the application. The code is below which I added to styles.css. But it has also removed scroll bars from the mat-select component, as a result my list of the dropdown is no more easily accessible. Please if someone can help me to understand how can I separate the mat-select from overall application style so that I can scroll my drop downs.

html {
  overflow: scroll;
  overflow-x: hidden;
  scrollbar-width: none;
}
::-webkit-scrollbar {
  width: 0px;  /* Remove scrollbar space */
  background: transparent;  /* Optional: just make scrollbar invisible */
  scrollbar-width: none;
}
Satyajeet Mishra
  • 17
  • 4
  • You can simply add scrollbar to mat-select element? This is CSS, you can "overwrite" previous changes by placing the code below your current code. – Mariusz Jun 21 '20 at 15:01

1 Answers1

0

That should do the trick... Use this class whenever you want to hide the scrollbar (not recommended btw, as some people don't use mouses...)

.noscrollbar::-webkit-scrollbar{display:none!important;visibility:hidden!important;}

gl.

amarinediary
  • 4,930
  • 4
  • 27
  • 45