2个表单元素和一个不在移动设备上工作的链接

时间:2015-11-24 19:23:35

标签: html css twitter-bootstrap mobile

我在使用bootstrap的网站上有一个登录表单。在桌面上没有问题。但是在移动设备上按钮不起作用,也没有复选框。还有一个忘记密码的链接,但这在移动设备上也不起作用。

<div class="col-md-4 col-xs-8">
    <form method="post">
        <div class="row">
            <div class="input-group col-md-12">
                <input type="text" class="form-control" style="margin-bottom:10px;" placeholder="User Name" aria-label="User Name" name="username"/>
                <input type="hidden" value="true" name="login_now"/>
            </div>
            <div class="col-md-12 input-group">
                <input type="password" class="form-control" placeholder="Password" aria-label="Password" name="password"/>
                    <span class="input-group-btn">
                        <button role="button" class="btn btn-blue" type="submit" aria-label="Log In" name="login_button">Log In</button>
                    </span>
                </div>
            <div class="col-md-12">
                <input type="checkbox" name="save-password" />
                &nbsp;&nbsp;Save Password (do not check box if using a public computer)&nbsp;
                <a class="password-link" href="forgot_password.php">Forgot Password?</a>
            </div>
        </div>
    </form>
</div>

我不知道为什么这不适用于移动设备,而是在桌面上工作

1 个答案:

答案 0 :(得分:0)

所以问题似乎是col-xs-8在顶部。它似乎导致输入与按钮重叠