尝试阻止自定义复选框在选中时跳转

Question

我正在为下周计划的项目制作一些自定义收音机和复选框，我想可能有点像“X”而不是支票。要使这个问题简短明了：

问题：

• 选中此自定义复选框后，复选框将向上跳跃约2px。我该如何防止这种行为？

可能重复：

• 问题：Why do these checkbox-hacked radio buttons jump when they are selected?

• 差异：OP的CSS是一个令人费解的body nth-of-type选择器的混乱，唯一的答案是没有接受一个令人费解的CSS混乱，而没有解释它是如何工作的。

感谢您的时间。

http://codepen.io/zer00ne/pen/dGVPBd?editors=110

Answer 1

尝试设置

line-height: 100%;

表示范围http://codepen.io/anon/pen/pgWjJd?editors=110

为我修好了。

Answer 2

弗兰克的答案可能更清晰，但这里有另一种选择......

input.X:checked + label span:before {
...
position:relative;
float:left;

}

从那里调整填充或字体大小以使＆＃39; X＆＃39;

居中

padding-left: -5px;
padding-top: -7px;
font-size: 8px;