I would say that this has something to do with screen shielding. I use a 2560x1440 resolution screen and see the problem on any number of parameters set in the selection box. When I drag it onto my 2736 x 1824 screen, I never see this white line below.
The latter is Surface Pro 4, which displays all the pixels in the native resolution of Win 10, displaying all the pixels "as it should be rendered."
I suspect that in some cases there may be a gap in different screen resolutions for this particular problem.
Looking at the comments, Andreyβs solution seems to be the best work for what you are trying to implement if the solution you make requires <select> and nothing but <select> .
Unfortunately, when it comes to rendering <select> elements, browser freedom is pretty high and runs from a level that is not controlled from the document. The reasons are various and irrelevant, but this is the current state of things. If you want to have full control over the way <select> displayed, you need to make fun of your behavior using other more controlled elements from the render point, such as <div> s, <span> or <ul> s. Or use a library that does the hard work for you, displaying easily stylish elements.
This is from my external monitor with a white line at the bottom

When used at my high resolution Surface Pro 4, the exact window (Chrome) looks like this without a white line at the end.

I would say that a pixel-based solution on one screen can cause problems with another depending on the screen resolution.
source share