Select options are displayed incorrectly on iPhone 11 / iOS 16.2 Icon "check" is overlapped by option value:
HTML code:
<div class="form-group d-inline-flex mb-0 form-group-quantity">
<label for="quantity_wanted">Qty</label>
<select class="custom-select custom-select-sm" name="product-quantity" id="quantity_wanted" data-product-id="27" value="1">
<option value="1" selected="">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</div>
I'm using Bootstrap v4.6.0. Tested on few devices, only on iPhone 11 the bug is reproducing.
Does anybody know why this issue happens?
Default iPhone's select comportment is expected:
