Gap between toggle switch buttons and container

[dtwen]

We're using angular for an android app. On my local, there is no gap. On my Samsung Galaxy S3, there is a 1px-3px gap between the toggle switch and container (see screenshots). I've tried 3 times to close the gap; As soon as I close one gap on the off button a gap will appear on the off button.

Attempt No 1

.toggle-switch .switch-off {
  left: -49%;
}

Attempt No 2

.toggle-switch .knob {
  border: none;
}

Attempt No 3

.toggle-switch .knob {
  border: none;
}

My current CSS:

     .toggle-switch {
    border: 2px solid #626262;
    float: right;
    }
    .toggle-switch span {
    height: 100%;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: normal;
    }
    .toggle-switch .switch-left {
    color: #fff;
    background: #33b5e5;
    text-transform: uppercase;
    }
    .toggle-switch .switch-right {
    color: #000;
    background: #1e6681;
    text-transform: uppercase;
    }

Any ideas on how to fix it so there's no gap on both buttons? Thanks.

[Silentspy]

I am currently having the same issue, i think it is related to left: -49%; as there could be a pixel or two difference.