Twitter bootstrap 引导表单输入字段对齐
我有下面的代码Twitter bootstrap 引导表单输入字段对齐,twitter-bootstrap,Twitter Bootstrap,我有下面的代码 <form id="editProfileForm" class="form-horizontal span8" method="post"> <div class="control-group"> <label class="control-label" for="inputSubject">Subject</label> <div class="controls">
<form id="editProfileForm" class="form-horizontal span8" method="post">
<div class="control-group">
<label class="control-label" for="inputSubject">Subject</label>
<div class="controls">
<input type="text" id="inputSubject" class="span8" >
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputTags">Tags</label>
<div class="controls">
<input type="text" id="inputTags" class="span3">
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputAccess">access</label>
<div class="controls">
<input type="text" id="inputAccess" class="span3">
</div>
</div>
主题
标签
通道
我得到的表格如下
有没有人能建议我怎样才能像下面这样?谢谢你的帮助
JS Fiddle link
表单内联
比表单水平
更适合于此
试试这个:
<form id="editProfileForm" class="span8 form-inline" method="post">
<div class="row">
<label class="span1" for="inputSubject">Subject</label>
<input type="text" id="inputSubject" class="span7">
</div>
<div class="row">
<label class="span1" for="inputTags">Tags</label>
<input type="text" id="inputTags" class="span3">
<label class="span1" for="inputAccess" id="inputAccessLabel">access</label>
<input type="text"id="inputAccess" class="span3">
</div>
</form>
谢谢莎拉的回答。这对我有帮助
#inputTags, #inputAccess {
float: left !important;
}
#inputAccessLabel {
margin-left: 35px;
margin-right: 5px;
}