JSFiddle - React, Tailwind, and code Playground

HTML

<div class="cnt">
<label>
  <span class="one">Test in Span</span>
  <span class="two">Span in test</span>
</label>
<input class="in" value="mmmnnnxx" type="text" />

</div>

CSS

.cnt {
  margin: 5px;
}

.one {
  background-color: #ffffff;
  border: solid 1px #ADADAD;
  height: 17px;
}
.two {
 	background-color: #ffffff;
	border: solid 1px #ADADAD;
  
  height: 17px;
 
}
.in {
  background-color: #ffffff;
  border: solid 1px #ADADAD; 
  height: 17px;
}

input {
  padding: 0;
  vertical-align: bottom;
}