我正在使用 Bootstrap 3,并为我的网页设置了这个网格:
<div class="container">
<div class="header">
<div class="top-nav">
<div class="row">
<div class="col-1">
<img src="https://sitename.com/logo.jpg">
</div>
<div class="col-7 mid-nav">
<!-- Search box & Navbar comes here -->
</div>
<div class="col-1" style="margin-top:30px !important;">
<a href="#"><i class="fa fa-shopping-cart fa-4x sabad-kharid"></i></a>
</div>
<div class="col-3">
<form method="POST" action="">
<div class="form-group">
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
</div>
<div class="form-group">
<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</div>
</div>
结果如下所示:
如您所见,Bootstrap 表单未出现在
col-3
中。类,它出现在这一行的下方。但是它应该放在 div 的左侧,类为 col-3
.那么这里出了什么问题?我该如何解决这个问题?
最佳答案
您应该使用 col-xs-1
col-xs-7
col-xs-3
在您的类(class)(而不是 col-7
)或任何大小并显示您想要的内容。
关于html - Bootstrap 网格列似乎无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70502984/