使用输入组在输入和按钮之间添加间隙

Question

如何input-group在Bootstrap 3上使用输入和按钮之间添加间隙？的jsfiddle

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <h1>Example</h1>
            <div class="input-group">
               <input type="text" class="form-control">
               <span class="input-group-btn">
                    <button class="btn btn-default" type="button">Go!</button>
               </span>
            </div>
        </div>
    </div>
</div>

Answer 1

将自定义类添加到class="input-group-btn"并使用填充来创建空间.

见工作示例.>class="input-group-btn input-space"

.input-group-btn.input-space {
  padding-left: 15px;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="row">
    <div class="col-md-12">
      <h1>Example</h1>

      <div class="input-group">
        <input type="text" class="form-control"> <span class="input-group-btn input-space">
                    <button class="btn btn-default" type="button">Go!</button>
               </span>

      </div>
    </div>
  </div>
</div>