SVG scaled background jumps on zoom in / zoom out

Question

I want to show search icon properly for all views - with zoom / without zoom and normal view. Problem appears when people zooms for example 110%. Icon jumps.

Fiddle: Fiddle ( try to zoom/zoom out - you will notice jumps )

HTML

<div id="outer">
  <div id="block"></div>
</div>

CSS

#outer
{
    background-color: #c0c0c0;
}

#block
{
    background-repeat: no-repeat;
    background-image: url(http://g3.acdn.lt/img/svg/icons_ptrn.svg);
    background-position: 0px 3.1%;
    width: 26px;
    height: 26px;
    display: block;
    background-repeat: no-repeat;
    padding: 0px;
    margin: 0 auto;
}

Tried:

• with and without background-position
• to set background position with pixels
• to set background position with percentages as it was suggested here: background-size with background-position doesn't scale the position?