JSFiddle - React, Tailwind, and code Playground

by Dmitriy Shvanyk

HTML

<div class="filter__checkbox-list">
    <label><input type="checkbox"> List 1 </label>
	<label><input type="checkbox"> List 2 </label>
	<label><input type="checkbox"> List 3 </label>
	<label><input type="checkbox"> List 4 </label>
	<label><input type="checkbox"> List 5 </label>
	<label><input type="checkbox"> List 6 </label>
	<label><input type="checkbox"> List 7 </label>
	<label><input type="checkbox"> List 8 </label>
</div>

SCSS

.filter__checkbox-list {
    height: 105px;
    overflow-y: auto;
    overflow-x: hidden;
	border: 1px solid #ccc;
	max-width: 300px;
	
	label{
		display: block;
		padding: 5px;
	}
	
	/* Width */
	&::-webkit-scrollbar {
		width: 6px;
	}
	/* Track */
	&::-webkit-scrollbar-track {
		background: #f1f1f1; 
	}
	/* Thumb */
    &::-webkit-scrollbar-thumb {
        background: red;
    }
	
}