-1

enter image description here

I want to add more padding to the select options

<label>Select:</label>
<select class="form-control " >
<option value="">No</option>
<option value="">Yes</option>
</select>
Belen
  • 9
  • 3
  • Does this answer your question? [How to style the option of an html "select" element?](https://stackoverflow.com/questions/7208786/how-to-style-the-option-of-an-html-select-element) – František Vojáček Jul 26 '21 at 19:19

4 Answers4

1

select{
  padding: 5px 50px 5px 50px ;
}
<label>Select:</label>
<select class="form-control " >
<option value="">No</option>
<option value="">Yes</option>
</select>

maybe is this you asked

  • padding top and button options have not changed – Belen Jul 26 '21 at 20:06
  • @Belen you can add padding in select box 5px to as you want from top and bottom but in options you can't there's limited css for – Sheikh Farzaib Jul 26 '21 at 20:19
1

The padding property does not work on the option element in all browsers, and it is a limitation of CSS. If you require more advanced styling, you may need to consider using Select2 or any other library that has options to customize the select option.

Iwalewa Fawaz
  • 82
  • 1
  • 6
0
select{
  padding: 7px 70px 7px 70px ;
}
AaYan Yasin
  • 566
  • 3
  • 15
0

if you need a Responsive form, Padding need to use percentage

.form-control{
 padding: 1% 1%;
}