对齐CSS切换开关

Question

使用this工具我可以创建一个CSS切换开关，但是当它放在我的页面上时，它在顶部略微偏离，似乎无法找到＆＃ 39;引起它。

我对CSS不太熟悉，但据我所知，onoffswitch-switch类指的是在click和onoffswitch-inner上移动的圆圈指的是每个选项，所以它必须是onoffswitch或onoffswitch-label ，但我没有看到任何可能导致这种情况的保证金选项，而且开始按钮也没有。

切换开关最初带有

display: block;

我切换到内联。

Here是完整的代码。

Answer 1

由于没有设置填充或边距，因此您的复选框与其父元素的顶部对齐。您可以使用填充或边距，但我建议在onoffswitch类中添加vertical-align：middle以获得更具响应性的设计。

.onoffswitch {
  position: relative; width: 105px;
  -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
  display: inline-block;
  vertical-align: middle;
}