html - 输入框和复选框的高度不同

Question

我使用 Bootstrap 3.0.3 制作了一个登录框。第二行，密码输入框和复选框(标记为Auth)的高度不同。在移动设备上，差异更加明显。

如何让他们的高度匹配？

Bootply

<form name="fhead" method="post" onsubmit="return fhead_submit(this);" autocomplete="off" role="form" class="form-inline">
<div id="outlogin_box" name="outlogin_box">
<input type="hidden" name="url" value="<?=$outlogin_url?>">
<input type="text" class="form-control input-sm" name="mb_id" maxlength="20" itemname="id" placeholder="login id">
<div class="input-group"><!-- needs height alignment -->
    <input type="password" class="form-control input-sm" name="mb_password" id="outlogin_mb_password" maxlength="20" itemname="password" placeholder="password">
    <span class="input-group-addon">
        <div class="checkbox">
        <label>
        <input type="checkbox" name="auto_login" title="Remember me" value="1" onclick="if (this.checked) { if (confirm('자동로그인을 사용하시면 다음부터 회원아이디와 패스워드를 입력하실 필요가 없습니다.\n\n\공공장소에서는 개인정보가 유출될 수 있으니 사용을 자제하여 주십시오.\n\n자동로그인을 사용하시겠습니까?')) { this.checked = true; } else { this.checked = false; } }">
        Auto
        </label>
        </div>
    </span>
</div>
<div class="input-group">
    <button type="submit" class="btn btn-success btn-sm btn-group-justified" >Login</button>
</div>
<div class="input-group">
    <div class="btn-group btn-group-justified">
        <a class="btn btn-default btn-sm" title="Register" href="<?=$g4[bbs_path]?>/register.php">Register</a>
        <a class="btn btn-default btn-sm" title="회원 id, password 찾기" href="javascript:win_password_lost();">아이디찾기</a>
    </div>
</div>
</div>
</form>

Answer 1

改变

<input class="form-control input-sm" name="mb_password" ...

到

<input class="form-control" name="mb_password" ...

http://www.bootply.com/98872

您已经通过添加类“input-sm”修改了输入的高度。