如何在引導程序中的兩個文本輸入之間自定義空間

Question

需要在bootstarp中輸入以下文本之間的水平空間。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="container"> 
 
    <div class="col-md-12"> 
 
    <div class="col-sm-6 col-lg-4"> 
 
     <div class="form-group"> 
 
     <!-- <div class="col-md-8"> --> 
 
     <input class="col-xs-3-offset-4" id="inputdefault" type="text" placeholder="AWB ID" style="background-color:#DCDCDC; height:40px"> 
 
     <!-- </div> --> 
 
     </div> 
 
    </div> 
 

 
    <div class="col-sm-6 col-lg-4"> 
 
     <div class="form-group"> 
 
     <!-- <div class="col-md-8"> --> 
 
     <input class="col-xs-4-offset-6" id="inputdefault" type="text" placeholder="Enter Your Traking Information..." style="background-color:#DCDCDC; height:40px;"> 
 
     <!-- </div> --> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

如何才能做到這一點。 Html空間不起作用。

Answer 1

我想你想這樣

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<style> 
 
.form-inline .form-group { 
 
    display: inline-block; 
 
    margin-bottom: 0; 
 
    vertical-align: middle; 
 
} 
 
.form-inline .form-control { 
 
    display: inline-block; 
 
    margin-bottom: 0; 
 
    vertical-align: middle; 
 
} 
 
.form-inline .form-group { margin-right:20px;} 
 
</style> 
 

 
<form class="form-inline" role="form"> 
 
    <div class="form-group"> 
 
     <label for="email2">Email:</label> 
 
     <input type="email" class="form-control" id="email2" placeholder="Enter email"> 
 
    </div> 
 
    <div class="form-group"> 
 
     <label for="pwd2">Password:</label> 
 
     <input type="password" class="form-control" id="pwd2" placeholder="Enter password"> 
 
    </div> 
 
    <div class="checkbox"> 
 
     <label><input type="checkbox"> Remember me</label> 
 
    </div> 
 
    <button type="button" class="btn btn-default">Submit</button> 
 
    </form>

Answer 2

如果我沒看錯，這將工作，

.container{ 
 
    margin-left: 100px; 
 
}

<div class="container"> 
 
    <div class="col-md-12"> 
 
    <div class="col-sm-6 col-lg-4"> 
 
     <div class="form-group"> 
 
     <!-- <div class="col-md-8"> --> 
 
     <input class="col-xs-3-offset-4" id="inputdefault" type="text" placeholder="AWB ID" style="background-color:#DCDCDC; height:40px"> 
 
     <!-- </div> --> 
 
     </div> 
 
    </div> 
 
    <br> 
 
    <br> 
 
    <div class="col-sm-6 col-lg-4"> 
 
     <div class="form-group"> 
 
     <!-- <div class="col-md-8"> --> 
 
     <input class="col-xs-4-offset-6" id="inputdefault" type="text" placeholder="Enter Your Traking Information..." style="background-color:#DCDCDC; height:40px;"> 
 
     <!-- </div> --> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>