Html 当屏幕尺寸变窄时，复选框高度变为高

Bootply（）

使用chrome/mobile视图（小宽度视图）， “验证”复选框的高度更改为高

验证复选框的高度必须相同

<form name="fhead" class="form-inline" role="form" onsubmit="return fhead_submit(this);" method="post" autocomplete="off">
<div id="outlogin_box" name="outlogin_box">
<input name="url" type="hidden" value="%2F">
<input name="mb_id" class="form-control" type="text" maxlength="20" placeholder="login id" itemname="아이디">
<div class="input-group">
    <input name="mb_password" class="form-control" id="outlogin_mb_password" type="password" maxlength="20" placeholder="password" itemname="password">
    <span class="input-group-addon">
        <div class="checkbox">
        <label>
        <input name="auto_login" title="Remember me" onclick="if (this.checked) { if (confirm('Using Auth?')) { this.checked = true; } else { this.checked = false; } }" type="checkbox" value="1">
        Auth
        </label>
        </div>
    </span>
</div>
<button class="btn btn-default btn-group-justified" type="submit">Login</button>
<div class="input-group">
    <div class="btn-group btn-group-justified">
        <a title="회원가입" class="btn btn-default" href="./bbs/register.php">회원가입</a>
        <a title="회원 id, password 찾기" class="btn btn-default" href="javascript:win_password_lost();">아이디찾기</a>
    </div>
</div>
</div>
</form>

认证
登录

我已经检查了您的代码，并设置了媒体查询：

@media (min-width: 768px){ .form-inline .radio, .form-inline .checkbox { display: inline-block; padding-left: 0; margin-top: 0; margin-bottom: 0; } }

因此，当宽度低于768px时，它会更改css，它会删除该媒体查询，并向该元素提供边缘，如下所示：

.radio, .checkbox { display: block; min-height: 20px; padding-left: 20px; margin-top: 10px; margin-bottom: 10px; vertical-align: middle; }

因此，您应该更改媒体查询宽度，或进行新的媒体查询。

---

我希望我帮了忙，并且我正确理解了你的问题

leni2312//谢谢。我只是使用Bootstrap3.0.3，而不是我自己的媒体查询。这可能是一个引导的错误？不能说太多，最近没有与它一起工作，可能是因为它刚刚发布。无论如何，您可以用自己的自定义css覆盖bootstrap css（不要更改原始css），这一点在这个问题上得到了很好的解释：“不要修改bootstrap.css文件”。。。所以我不想修改媒体查询。我将向bootstrap团队报告这一点。您可以在自定义css中使用自己的媒体查询覆盖它，只需将您的类添加到该复选框中，并编写自己的cssI am I php和jquery程序员，所以我不知道媒体查询。我无法使用媒体查询制作自己的css。询问代码的问题必须证明对所解决问题的最低理解。包括尝试过的解决方案、它们不起作用的原因以及预期结果。另见：