twitter-bootstrap – 水平表单:标签旁边的文本输入不起作用
发布时间:2020-12-17 21:20:59 所属栏目:安全 来源:网络整理
导读:我试图将标签与Bootstrap 4水平形式的文本框放在同一行.似乎没有用.文本框始终显示在下一行中.任何帮助是极大的赞赏. div class="form-group form-group-sm col-sm-6" label for="first_name" class="col-form-label"First Name/label div input type="text"
我试图将标签与Bootstrap 4水平形式的文本框放在同一行.似乎没有用.文本框始终显示在下一行中.任何帮助是极大的赞赏.
<div class="form-group form-group-sm col-sm-6"> <label for="first_name" class="col-form-label">First Name</label> <div> <input type="text" class="form-control" id="first_name" name="first_name"> </div> </div> 小提琴:https://jsfiddle.net/gunnersfan/mrc4tdu1/ 解决方法
col- *必须在.row中.在标签上使用网格列类并输入包装器…
http://www.codeply.com/go/TUs7hGHnXP <form class="form-horizontal"> <div class="container"> <div class="row"> <div class="form-group form-group-sm col-sm-6"> <div class="row"> <label for="first_name" class="col-sm-3 col-form-label">First Name</label> <div class="col-sm-9"> <input type="text" class="form-control" id="first_name" name="first_name"> </div> </div> </div> <div class="form-group form-group-sm col-sm-6"> <div class="row"> <label for="last_name" class="col-sm-3 col-form-label">Last Name</label> <div class="col-sm-9"> <input type="text" class="form-control" id="last_name" name="last_name"> </div> </div> </div> <div class="form-group form-group-sm col-sm-6"> <div class="row"> <label for="Street" class="col-sm-3 col-form-label">Street</label> <div class="col-sm-9"> <input type="text" class="form-control" id="Street" name="Street"> </div> </div> </div> <div class="form-group form-group-sm col-sm-6"> <div class="row"> <label for="City" class="col-sm-3 col-form-label">City</label> <div class="col-sm-9"> <input type="text" class="form-control" id="City" name="City"> </div> </div> </div> </div> </div> </form> http://www.codeply.com/go/TUs7hGHnXP (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |