Often use background-position: left center, background image vertically. The smallest unit of the browser page rendering is the pixel, so in some cases even if the definition of a "center", the actual effect is not necessarily vertically.
E.g:
- Element: High 16px;
- Background Image: High 13px;
- 定义background-position:left center
The actual results in the following figure: 
you can clearly see from the background image on the border "2px", from the bottom border "1px". The figure is the result of the test in Chrome, other browsers, too, but is there from the border "1px", from the lower border of "2px".
solution
To achieve 100% of the vertical center, the "element height - height of the background image" may be divisible by 2, so the embodiment may be set to the height of the element "17px", or the background image to change the height "12px."
Reproduced in: https: //www.cnblogs.com/rainman/archive/2011/08/17/2143631.html