javascript - 模态 Bootstrap 用户输入

Question

我已经在 Bootstrap 的帮助下设置了我的页面。 访问:hubb.tekkkz.com 我遇到的问题是，如果您单击右侧的登录/注册，则会出现模态。但!用户输入元素没有父容器那么宽，因此元素和模式之间左侧的可用空间小于右侧。

如何使元素具有完整的容器/父级宽度？

<div class="modal fade bs-example-modal-sm" id="loginModal" tabindex="-1" role="dialog" aria-labelledby="loginModal" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true"><span class="glyphicon glyphicon-remove"></span></span></button>
                <h4 class="modal-title" id="exampleModalLabel">Login</h4>
            </div>
            <div class="modal-body">
                <form action="" method="post">
                    <p><input type="text" class="form-control" placeholder="Username" name="username" value=""></p>
                    <p><input type="password" class="form-control" placeholder="Password" name="password" value=""></p>
                    <p><input class="btn btn-primary form-control" type="submit" value="Login"></p>
                </form>
            </div>
        </div>
    </div>

Answer 1

创建一个新类将这个类添加到模型输入

.form-control-login { 
width: 100% !important;  
}