我已经在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>
答案 0 :(得分:2)
创建一个新类将此类添加到modelinputs
.form-control-login {
width: 100% !important;
}
答案 1 :(得分:1)
添加以下css
#loginModal .form-inline .form-control,
#registerModal .form-inline .form-control {
width: 100%!important;
}