I think I've accidentally found a solution. The only thing to do is inserting an empty <span class="input-group-addon"></span>
between the <input>
and the <select>
.
Additionally you can make it "invisible" by reducing its width, horizontal padding and borders:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>_x000D_
_x000D_
<div class="input-group">_x000D_
<span class="input-group-addon" title="* Price" id="priceLabel">Price</span>_x000D_
<input type="number" id="searchbygenerals_priceFrom" name="searchbygenerals[priceFrom]" required="required" class="form-control" value="0">_x000D_
<span class="input-group-addon">-</span>_x000D_
<input type="number" id="searchbygenerals_priceTo" name="searchbygenerals[priceTo]" required="required" class="form-control" value="0">_x000D_
_x000D_
<!-- insert this line -->_x000D_
<span class="input-group-addon" style="width:0px; padding-left:0px; padding-right:0px; border:none;"></span>_x000D_
_x000D_
<select id="searchbygenerals_currency" name="searchbygenerals[currency]" class="form-control">_x000D_
<option value="1">HUF</option>_x000D_
<option value="2">EUR</option>_x000D_
</select>_x000D_
</div>
_x000D_
Tested on Chrome and FireFox.