Добавление отступов для удаления выберите активный элемент

Question

Я пытаюсь выкинуть элементы, которые активны, однако это кажется невозможным. Они хотят, чтобы переместить

к этому:

так что есть некоторые дополнительные обивка на левой стороне. Однако я не могу настроить целевое состояние.

HTML:

<select class="input-select gender-dropdown"  id="dwfrm_profile_customer_customergender"  name="dwfrm_profile_customer_customergender" style="-webkit-appearance: none;"> 
    <option class="select-option" label="Male" value="1">Male</option> 
    <option class="select-option" label="Female" value="2">Female</option> 
    </select> 

• Я обнаружил, что removiing в -webkit-внешний вид: никто не делает это пространство должным образом, но он также удаляет нижнюю границу

Answer 1

Используйте padding, как этот

.input-select { 
 
    padding: 6px 24px 6px 12px; 
 
    font-size: 16px; 
 
}

<select class="input-select gender-dropdown" id="dwfrm_profile_customer_customergender" name="dwfrm_profile_customer_customergender" style="-webkit-appearance: none;"> 
 
    <option class="select-option" label="Male" value="1"> Male</option> 
 
    <option class="select-option" label="Female" value="2"> Female</option> 
 
</select>