How do I hide the scrollbar for an html element using just CSS, while still being able to scroll?
To remove the default scrollbar while still maintaining the functionality of scrolling, using CSS you would have to manually remove the scrollbar from the display for each browser.
Here is an example:

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

After adding this snippet of code to your CSS stylesheet and adding the "no-scrollbar" class to the necessary elements. The scrollbar should be removed but its functionality should be maintained.