HTML checkbox 'checked' property affects style?

Question

I have a small sliding options control I'm coding in plain HTML and JS. it looks like this in chrome:

When none of the checkboxes is checked, it works as expected but when I check a checkbox, the alignment of the right icons breaks:

This happens both in chrome and firefox.
The live example is here:

http://shooshx.github.io/happysolver/emscripten/index.html

What the difference in style between a checked and unchecked checkbox?
How can I fix the misalignement?

Answer 1

You have to remove float:right from .cube_count