JSFiddle - React, Tailwind, and code Playground

HTML

<div class="sort-options-wrapper">
		<div class="sort-options-wrapper-2">
			<select class="sort-options">
					<option value="choiceOne">choiceOne</option>
					<option value="choiceOne">choiceThree</option>
					<option value="choiceOne">choiceFour</option>
					<option value="choiceFiveLongTestPurpose">choiceFiveLongTestPurpose</option>
			</select>
		</div>
		<div class="search-select-arrow-down"></div>
	</div>

CSS

.sort-options-wrapper {
		display: inline-block;
		position: relative;
		border: 1px solid #83837f;
	}
	/* this second wrapper is needed for x-browser compatibility */
	.sort-options-wrapper-2 {
		overflow: hidden;
	}
	select {
		margin-right: -19px;
		padding-left: 13px;
		margin-left: 0;
		border: none;
		background: none;
		/* margin-top & margin-bottom must be set since some browser have default values for select elements */
		margin-bottom: 1px;
		margin-top: 1px;
	}
	select:focus {
		outline: none; /* removing default browsers outline on focus */
	}
	.search-select-arrow-down {
		position: absolute;
		height:10px;
		width: 12px;
		background: url(http://i.imgur.com/pHIYN06.png) scroll no-repeat 2px 0px;
		left: 1px;
		top: 5px;
	}