JSFiddle - React, Tailwind, and code Playground
HTML
<div class='column names'>
<div class='form-group string optional user_name full_name'>
<label class="string optional control-label" for="user_name">Name</label>
<div class='controls'>
<div class='input_group'>
<select class="select optional form-control group_item title" placeholder="Title" name="user[title]" id="user_title">
<option value=""></option>
<option selected="selected" value="Mr">Mr</option>
<option value="Mrs">Mrs</option>
<option value="Ms">Ms</option>
<option value="Miss">Miss</option>
<option value="Dr">Dr</option>
<option value="Sir">Sir</option>
<option value="Other">Other</option>
</select>
<input class="string optional form-control group_item" maxlength="255" size="255" type="text" name="user[name]" id="user_name" />
</div>
</div>
</div>
<div class='form-group string optional user_company'>
<label class="string optional control-label" for="user_company">Company</label>
<div class='controls'>
<input class="string optional form-control" maxlength="255" size="255" type="text" value="" name="user[company]" id="user_company" />
</div>
</div>
</div>
CSS
.column.names {
width: 48%;
float: left;
}
select {
min-width: 6em;
align-items: center;
justify-content: center;
width: 7em;
}
input {
width: 100%;
}
.input_group {
display: flex;
}