Question

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

Auth复选框的高度必须相同。

<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>

Answer 1

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

@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; }

因此，您应该更改该媒体查询宽度，或进行新的媒体查询。我希望我帮助了，而且我正确地理解了你的问题

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

1 个答案: