JSFiddle - React, Tailwind, and code Playground

HTML

<div class="form-column">
<label for="Input1">Option 1</label> 
<select id="Input1"><option>All</option></select>
<br>
<label for="Input2">Option 2</label> 
<input id="Input2" type="text"/>
<br>
<label for="Input3">Option 3</label> 
<input id="Input3" type="text"/>
</div>
    
<div class="form-column">
<label for="Input4">Option 4</label> 
<select id="Input4"><option>--</option></select>
<br>
<label for="Input5">Option 5</label> 
<select id="Input5"><option>0</option></select>
<br>
<label for="Input6">Option 6</label> 
<select id="Input6"><option>1</option></select>
</div>

CSS

.form-column { 
    width: 50%;
    float:left; 
}
.form-column label {
    width: 40%;
    padding-right: 10%;
}


/*
This right justifies your inputs, which I don't recommend.

.form-column select, .form-column input {
    float: right;

}
.form-column br {
    clear: right;
}
*/