Javascript 镀铬的小复选框，不可勾选

出于某种原因，此表单上的复选框不可点击，并且使用谷歌chrome时非常非常小。使用firefox时，复选框非常有效。我不确定要找什么。。。真奇怪！！！我使用的方式有问题吗？当我使用inspector时，即使我禁用了所有css，复选框仍然很小。不知道发生了什么事。重置浏览器缓存等确实需要一些帮助

HTML:：

CSS:

截图：

JS

---

我也有这个问题，必须设置复选框的高度和宽度：

.make-checkbox-reasonable-height {
    height: 16px;
    width: 16px;
}

<div class="col-sm-2">
    <input asp-for="MyCheckBox" class="form-control input-control make-checkbox-reasonable-height" />
</div>

---

这似乎奏效了。。你也可以发布你的css或更多的代码吗？你的表单没有方法，但不应该是这种情况。您忘记了标签中for属性后面的=符号。@BeNdErR有很多事情发生，您是否想到了任何具体的原因？我可以发布更多的代码，但有很多，不想在页面上膨胀，我们需要看到你的CSS。停止CSS的工作。如果它解决了问题，那就是CSS问题。@MatthewA.McFarland我也遇到了同样的问题。你有没有发现问题的根源？

<script>
$(document).ready(function() {
    $('form').each(function() { this.reset() });
    var progress = 0;

    $categories = $('.categories');
    $sub_categories = $('.sub-categories');

    $(document).on('click','.tyl_category', function(e) {

        $form = $('#form-'+this.id);
        console.log(this.id);
        $categories.hide('slide', { direction: 'left' }, 250, function() {
            $sub_categories.show();
            $form.show('slide', { direction: 'right' },250);
        });
    });

    $(document).on('click','input[type="checkbox"]', function (e) {
        var $this = $(this);
        var $progress_bar = $('#tyl_progress_bar');
        if ($this.is(':checked')) {
            progress +=1;
        } else {
            progress -=1;
        }
        $progress_bar.text('Step '+progress+'/5');
        $progress_bar.css({width: (progress*25)+"%"});  
        $form = $this.parent('div');
        $form.hide('slide', { direction: 'left' }, 250, function() {
            $sub_categories.show();
            $categories.show('slide', { direction: 'right' },250);
        });


    });

});
</script>

.make-checkbox-reasonable-height {
    height: 16px;
    width: 16px;
}

<div class="col-sm-2">
    <input asp-for="MyCheckBox" class="form-control input-control make-checkbox-reasonable-height" />
</div>