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

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;

}

从那里调整填充或字体大小以使'X'居中

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