I'm having trouble placing my vertical scrollbar inside my div and adjusting its position.
To streamline the code, I have extracted a portion below:
.toprightcontrols {
margin: 0 3% 0 0;
display: flex;
position: absolute;
justify-content: flex-end;
top: 0;
width: 150px;
flex-wrap: wrap;
}
#mymenu{
padding:10px;
background:none;
border:0;
outline:0;
cursor:pointer;
align-self:center;
justify-self:right;
}
#mymenu:before{
content:url(http://127.0.0.1/img/blog/list.png);
}
.menu-title{
display:flex;
justify-content:center;
}
.dropdown-toggle:after{
display:block!important;
}
.hr{
margin:5px 5px 10px 5px;
}
.country{
background:#555;
color:#fff;
font-size:0.7rem;
display:inline-block;
padding:0px 3px;
}
button{
margin:0;
font-family:inherit;
font-size:inherit;
line-height:inherit;
}
...
The full code can be accessed here:
I've experimented with adding padding but didn't see any changes. It's important that the border-radius doesn't interfere with the scrollbar.
Can you please guide me on where I might be going wrong? Any assistance would be greatly appreciated.
Thank you!