如何为每行提供空间（CSS问题）

Question

在我的输出下面，没有每个行的空间，如何使用Bootstrap CSS为每一行提供空间？请检查代码

 <div class="form-group" >

                       <div class="col-sm-2">
                           <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
                       </div>
                   </div>

提前感谢

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.css">

<div class="form-group">
  <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

  <div class="col-sm-2">
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
</div>


<div class="form-group">
  <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

  <div class="col-sm-2">
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
</div>

<div class="form-group">
  <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

  <div class="col-sm-2">
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
</div>





<div class="form-group">
  <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

  <div class="col-sm-2">
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
</div>

<div class="form-group">
  <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

  <div class="col-sm-2">
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
</div>

<div class="form-group">
  <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

  <div class="col-sm-2">
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
</div>





<div class="form-group">
  <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

  <div class="col-sm-2">
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
</div>

<div class="form-group">
  <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

  <div class="col-sm-2">
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
</div>

<div class="form-group">
  <label for="inputEmail3" class="col-sm-2 control-label">Email</label>

  <div class="col-sm-2">
    <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
  </div>
</div>

Answer 1

正确的标记应该是（使用您的co宽度作为例子）：

    <div class="row">
        <div class="col-sm-2">
            <div class="form-group">
                <label for="input1">Some label</label>
                <input id="input1" placeholder="Type something…" type="text">
            </div>
            <div class="form-group">
                <label for="input2">Some label 2</label>
                <input id="input2" placeholder="Type something…" type="text">
            </div>
        </div>
    </div>

目前，您没有定义任何行。

Answer 2

.form-group > * {
           margin:5px;
        }