Tab键不能处理自定义CSS复选框

Question

如果我开始浏览表单输入字段，我刚刚注意到它跳过我的自定义CSS复选框，其中包含以下代码：

.voucher_form input[type="text"],
.voucher_form input[type="email"]{
.box-sizing;
border-radius:14px;
background-color:#fff;
padding:6px 5px;
width:inherit;
border:0;
-moz-box-shadow:inset -1px 1px 3px #888;
-webkit-box-shadow:inset -1px 1px 3px #888;
box-shadow:inset -1px 1px 3px #888;
margin-top:6px;
font-size:16px;
color:#6f6f6f;
}

.voucher_form input[type="checkbox"]{
padding:0;
}

.voucher_form  input[type="checkbox"] {
display:none;
}

.voucher_form  input[type="checkbox"] + label span{
display:inline-block;
width:20px;
height:20px;
margin:-2px 4px 0 0;
vertical-align:middle;
cursor:pointer;
}

.voucher_form  input[type="checkbox"] + label span{
background:url("../image/radio.png") 0 0 no-repeat;
}

.voucher_form  input[type="checkbox"]:checked + label span {
background:url("../image/radio.png") 0 -20px no-repeat;
}

是否因为以下设置为'display：none'？

 .voucher_form  input[type="checkbox"] {
   display:none;
 }

如果是，有办法解决这个问题吗？