JSFiddle - React, Tailwind, and code Playground

by shubhangia

HTML

<html>
<head>
<title>select2 sample</title>
<style>
	select {
		width: 200px;
	}
	
	.select2-selection__rendered {
		height: 50px;
		overflow-y: auto !important;
	}
</style>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.3.1.min.js" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
</head>
<body>
	<select class="js-example-basic-single" name="states[]" multiple="multiple">
	  <option value="AL">one Alabama</option>
	  <option value="WY">two Wyoming</option>
	  <option value="AL">three Alabama</option>
	  <option value="WY">four Wyoming</option>
	  <option value="AL">five Alabama</option>
	  <option value="WY">six Wyoming</option>
	  <option value="AL">seven Alabama</option>
	  <option value="WY">eight Wyoming</option>
	  <option value="AL">nine Alabama</option>
	  <option value="WY">ten Wyoming</option>
	</select>
<script>
	$(document).ready(function() {
		$('.js-example-basic-single').select2();
	});
</script>
</body>
</html>