JSFiddle - React, Tailwind, and code Playground

by Dhanck

HTML

<div class="form-row fake_line">
						<select class="p1 ">
            <option><span class="">Das</span>Option 1</option>
							<option>Option 2</option>
							<option>Option 3</option>
							<option>Option 4</option>
							<option>Option 5</option>
						</select>
					</div>

CSS

.form-row select {
    margin-left: 25px;
    width: calc(100% - 23px);
    font-size: 14px;
    border: 1px solid #ccc;
    height: 24px;
}
.fake_line{
  font-size:30px;
}
/* CAUTION: IE hackery ahead */
.form-row select::-ms-expand { 
    display: none; /* remove default arrow in IE 10 and 11 */
}

/* target Internet Explorer 9 to undo the custom arrow */
@media screen and (min-width:0\0) {
    .form-row select {
        background:none\9;
        padding: 5px\9;
    }
}