为什么不是在下面而是在右边呢?
<div class="container" style="
margin-top: 100px;">
<form>
<div class="form-group" id="div1" style="width:65%">
<label class="col-sm-5 col-md-5 col-lg-3 control-label" style="text-align:right;height:34px;line-height:32px;" for="inputError">
</label>
<div class="col-sm-7 col-md-7 col-lg-9">
<input type="text" id="ipt1" class="form-control" id="name"
placeholder="请输入用户名">
</div>
</div>
<div class="form-group" id="div2" style="width:65%">
<label class="col-sm-5 col-md-5 col-lg-3 control-label" style="text-align:right;height:34px;line-height:32px;" for="inputError">
</label>
<div class="col-sm-7 col-md-7 col-lg-9">
<input type="password" id="ipt2" class="form-control" id="name"
placeholder="请输入密码">
</div>
</div>
<div class="form-group" id="div3" style="width:65%">
<label class="col-sm-5 col-md-5 col-lg-3 control-label" style="text-align:right;height:34px;line-height:32px;" for="inputError">
</label>
<div class="col-sm-7 col-md-7 col-lg-9">
<input type="password" id="ipt3" class="form-control" id="name"
placeholder="请确认密码">
</div>
</div>
<div class="form-group" id="div4" style="width:65%">
<label class="col-sm-5 col-md-5 col-lg-3 control-label" style="text-align:right;height:34px;line-height:32px;" for="inputError">
</label>
<div class="col-sm-7 col-md-7 col-lg-9">
<input type="email" id="ipt4" class="form-control" id="name"
placeholder="请输入邮箱">
</div>
</div>
<button type="submit" class="btn btn-default">提交</button>
</form>
</div>
<div class="form-group" style="width:65%;">
<div class="col-sm-7 col-md-7 col-lg-9">
<button type="submit" class="btn btn-default"></button>
</div>
</div>
form-group
是带有inline-block
的,所以会堆叠在一行,而你前几个元素都是设置成width:65%
,也就导致他们会自动换行(因为空间不够了),而唯有submit button
的宽度足够小,所以直接就浮动到上面去了。