增加复选框大小[重复]答案

【问题标题】：Increase Checkbox Size [duplicate]增加复选框大小[重复]
【发布时间】：2019-10-26 18:34:03
【问题描述】：

如何增加复选框的宽度和高度？我尝试根据其他示例增加 .list-group input[type="checkbox"] + label:before 内部的宽度和高度，但框的大小没有改变。

<ul class="list-group ml-3 mr-3 mt-1 " style="background-color:pink; height:auto">

    <li class="list-group-item d-flex p-0 border-0 ">
        <input style="background-color:yellow" class="" type="checkbox" id="CheckBox1" />
        <label style="font-size: 15px;"class="list-group-item w-100 p-0 border-0" for="CheckBox1">Caption asdsad asdasd </label>
    </li>

</ul>

/* Hide the browser's default checkbox */
.list-group input[type="checkbox"] {
    display: none;
}       

.list-group input[type="checkbox"] + label:before {
    content: "\2714";
    border: 0.1em solid #000;
    margin-right: 10px;
    color: transparent;
    width: 10px; // this is not working
    height: 20px; // this is not working
}

【问题讨论】：

标签： html css twitter-bootstrap

【解决方案1】：

将display: inline-block; 添加到.list-group input[type="checkbox"] + label:before。

【讨论】：