JSFiddle - React, Tailwind, and code Playground
HTML
<form>
<fieldset>
<legend>These are Text Fields</legend>
<div>
<input type="text" id="text1">
<label for="text1">Text Field</label>
</div>
<div>
<input type="text" id="text2">
<label for="text2">More Text</label>
</div>
</fieldset>
</form>
CSS
fieldset {
display: flex;
flex-direction: row;
justify-content: space-between;
border: none;
}
label {
display: none;
}
legend {
display: block;
width: 100%;
}
fieldset > div {
display: inline;
flex: 1 1 auto;
}
input {
width: 100%;
}