On the android, the element on the left has a margin of a couple of pixels. Resetting paddings and marjins does not help, text-indent: 0; Does not help. I found a similar problem on stackoverflow ( https://stackoverflow.com/questions/28504026/left-offset-of-select-text ) so that it is clear what this is about, but there is no solution. Can anyone know how to solve the problem, or at least turn on the wag and offer some options? Googling does not help.

  • Describe in more detail what you are trying to do, but it is not clear exactly how you are trying to show html in Android. Is this a website or a native application? - anber
  • This is the site I am using Chrome Canary debug day. - andreyqin

2 answers 2

Try assigning padding , text-indent and margin to the option tag. If you use a standard font and it is not connected via CSS, try connecting it.

  • Applying styles to option does not help, the font is not standard and is already connected. - andreyqin
  • -webkit-appearance use the properties -webkit-appearance , border-width , box-sizing ? - nick777
  • Does not help. Properties with values ​​of none, 0 and border-box, respectively, do not give the desired result. Tried to apply to both option and select. - andreyqin
  • Add the property margin-left: -3px; go to select and do zeroing at min-width 768px. - nick777
  • one
    Use js. var ua = navigator.userAgent.toLowerCase(); var isAndroid = ua.indexOf("android") > -1; if(isAndroid) { jQuery("select").css({'margin-left':'-3px'}); } var ua = navigator.userAgent.toLowerCase(); var isAndroid = ua.indexOf("android") > -1; if(isAndroid) { jQuery("select").css({'margin-left':'-3px'}); } - nick777

This is how it is removed:

 select { font: inherit; color: inherit; line-height: inherit; text-transform: inherit; text-shadow: inherit; border: none; background: none; box-shadow: none; border-radius: 0; margin: 0; padding: 0; }