CSS - Select dropdown additional padding being added

Question

I have noticed that select elements appear to be adding some additional padding on the left edge of the dropdown. Here is a JSFiddle to illustrate:

Even when I apply padding: 0 it still adds in an extra 2/3px padding that I cannot seem to get rid of.

Does anybody know what it causing this and how I can remove the additional padding so that the text meets the left edge of the dropdown?

Are you referring to the BODY default margin? html, body {margin: 0;} See [your fiddle here](https://jsfiddle.net/Ls25gxdt/5/) — crazymatt, Jul 02 '15 at 23:17
See this question and answer: http://stackoverflow.com/questions/17186777/adding-padding-to-select-options — Spade, Jul 02 '15 at 23:22
trying to style a select element is like putting nail polish on a snow leopard. check out codrops if you want some good inspiration on how to do some nifty things with this - http://tympanus.net/codrops/2014/07/10/inspiration-for-custom-select-elements/ — Deryck, Jul 02 '15 at 23:24
Or you can reference this SO question as well http://stackoverflow.com/questions/27006354/text-padding-in-select-boxes — crazymatt, Jul 02 '15 at 23:24
possible duplicate of [how to style the option of a html "select"?](http://stackoverflow.com/questions/7208786/how-to-style-the-option-of-a-html-select) — Stickers, Jul 03 '15 at 01:22

score 1 · Answer 1 · edited Jul 03 '15 at 01:23

1

Unfortunately this is to do with the browser's rendering engine. It varies per browser and OS.

edited Jul 03 '15 at 01:23

Stickers

answered Jul 02 '15 at 23:26

1 Answers1