[英]Bootstrap 4 Layout not working as expected when used with forms
我正在表單上使用Bootstrap 4。 現在,當將表單與網格類一起使用時,它實際上並沒有按預期的方式工作。 輸出可以在這里看到http://www.henryspike.tk/testform
我所期望的是看到整個12列分為4-4-4,每列包含一個輸入字段,但它會堆疊起來。
<div class="row">
<div class="col-md-12 offset-md-1">
<div class="row">
<form class="form">
<div class="col-md-4">
<div class="form-group">
<label for="name">Name</label>
<input class="form-control" type="text" name="name" id="name" placeholder="eg. John Doe" required>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="email">Name</label>
<input class="form-control" type="email" name="email" id="email" placeholder="someone@example.com" required>
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="username">Name</label>
<input class="form-control" type="text" name="username" id="username" placeholder="eg. JDoe12" required>
</div>
</div>
</form>
</div>
</div>
</div>
col-
應該始終是row
..的直接子代。
http://www.codeply.com/go/moFmNMMuPs
<div class="row">
<div class="col-md-12">
<form class="row form">
<div class="col-md-4">
<div class="form-group">
<label for="name">Name</label>
<input class="form-control" type="text" name="name" id="name" placeholder="eg. John Doe" required="">
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="email">Name</label>
<input class="form-control" type="email" name="email" id="email" placeholder="someone@example.com" required="">
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="username">Name</label>
<input class="form-control" type="text" name="username" id="username" placeholder="eg. JDoe12" required="">
</div>
</div>
</form>
</div>
</div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.