How to give the padding for option with css only

Question

How we can give the padding for option in select box or height ? like this :

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="vw">VW</option>
  <option value="audi" selected>Audi</option>
</select>

500+ rep and no [mcve]? What do you mean by padding? That the options have the same size? — mplungjan, Nov 09 '16 at 13:22
Like the option that are opening on after click on select box i want give the padding for that — Bhupinder kumar, Nov 09 '16 at 13:23
As in this duplicate? http://stackoverflow.com/questions/22681141/select-option-padding-not-working-in-chrome — mplungjan, Nov 09 '16 at 13:23
Not exist a W3C specification about styling select options. If you want style a select-option box you have to build from scratch your ouw select box. Or use one like select2.github.io — CastenettoA, Nov 09 '16 at 13:45

score 2 · Answer 1 · answered Nov 09 '16 at 13:24

2

You cannot add custom style to Select input element since they are render by User agents (Browsers). You can use some plugin to render select element so that you can customize as you wish.

answered Nov 09 '16 at 13:24

Sa Si Kumar

652
1
5
12

score 0 · Accepted Answer · answered Nov 10 '16 at 05:05

0

Yes you cannot add custom style to Select input element since they are render by User agents (Browsers). You can use some plugin to render select element so that you can customize as you wish.

answered Nov 10 '16 at 05:05

How to give the padding for option with css only

2 Answers2