Моя кнопка
HTML
<label class="chbutton">
<input type="checkbox" />
<span class="chbutton-sp">
<span class="ch_inner">
<span class="ch_left">да</span>
<span class="ch_right">нет</span>
</span>
</span>
</label>
CSS
.chbutton {
display: inline-block;
vertical-align: middle;
white-space: nowrap;
padding: 0;
position: relative;
overflow: hidden;
}
.chbutton-sp {
font: 20px/1.5em "Helvetica Neue", Arial, sans-serif;
position: relative;
z-index: 1;
display: inline-block;
background: -webkit-gradient(linear, left top, right top, color-stop(0.5, #3290de), color-stop(0.5, #acacac));
background: -webkit-linear-gradient(left, #3290de 50%, #acacac 50%);
background: -moz-linear-gradient(left, #3290de 50%, #acacac 50%);
background: -o-linear-gradient(left, #3290de 50%, #acacac 50%);
background: -ms-linear-gradient(left, #3290de 50%, #acacac 50%);
background: linear-gradient(left, #3290de 50%, #acacac 50%);
-webkit-background-size: 200% 100%;
-moz-background-size: 200% 100%;
background-size: 200% 100%;
text-align: center;
-webkit-border-radius: 5px;
border-radius: 5px;
height: 1.5em;
padding: 0 0.9em;
vertical-align: top;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
color: #fff;
text-shadow: 0 -1px 0 rgba(0,0,0,0.75);
-webkit-transition: background-position 0.3s;
-moz-transition: background-position 0.3s;
-o-transition: background-position 0.3s;
-ms-transition: background-position 0.3s;
transition: background-position 0.3s;
}
.chbutton-sp:after {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-box-shadow: inset 0 2px 6px rgba(0,0,0,0.5);
box-shadow: inset 0 2px 6px rgba(0,0,0,0.5);
-webkit-border-radius: 5px;
border-radius: 5px;
}
.ch_inner {
display: block;
position: relative;
left: 0%;
height: 100%;
-webkit-transition: left 0.3s;
-moz-transition: left 0.3s;
-o-transition: left 0.3s;
-ms-transition: left 0.3s;
transition: left 0.3s;
}
.chbutton > input:checked + .chbutton-sp {
background-position: 100% 0;
}
.chbutton > input:checked + .chbutton-sp > .ch_inner {
left:...