javascript - Margin-top between firefox is difference from Chrome -

my styling in css working chrome works differently firefox.

html code:

<input type="checkbox" checked data-toggle="toggle" data-onstyle="warning" data-on="公開 <div class='toggle_on'></div>" data-off="<div class='toggle_off'></div> 非公開"> 

here css code :

.toggle_on {     background: #fff;     padding: 13px;     float: right;     margin-top: -5px;     -moz-margin-top:-25px;     margin-right: -20px;     -webkit-box-shadow: 0px 7px 20px -2px rgba(117,112,117,1);     -moz-box-shadow: 0px 7px 20px -2px rgba(117,112,117,1);     box-shadow: 0px 7px 20px -2px rgba(117,112,117,1);     border-radius: 3px; } 

and here result in chrome :

and 1 in firefox:

so idea this??

this errors happen not because of css because of html code:

code before :

<input type="checkbox" checked data-toggle="toggle" data-onstyle="warning" data-on="公開 <div class='toggle_on'></div>" data-off="<div class='toggle_off'></div> 非公開"> 

and change :

<input type="checkbox" checked data-toggle="toggle" data-onstyle="warning" data-on="<div class='toggle_on'></div> 公開" data-off="<div class='toggle_off'></div> 非公開"> 

and work fine browser.

thanks!