<aside  id="sidenav-main"></aside>

I have a aside and it contains a scrollbar. I would like the scrollbar to be a little thinner, i.e. the width would be smaller. In case I want to remove the scrollbar I just need to make it "overflow-hidden". But to change the width I can't find anything in bootstrap. Can anyone help me? Thanks

Example

CodePudding user response：

you can style it like that

aside::-webkit-scrollbar {
    width: 3px;
}
aside::-webkit-scrollbar-thumb {
    border-radius: 1px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
 }

to hide scrollbar

/* Hide scrollbar for Chrome, Safari and Opera */
aside::-webkit-scrollbar {
  display: none;
}

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

CodePudding user response：

@daviddiniss can you provide the full code for the same? Also which version of bootstrap are you using.