Bootstrap按钮卡在一起

Question

当我把按钮放在桌子上时，它会卡在一起

<tbody>
          <tr>
            <td>1</td>
            <td>New York</td>
            <td>755535</td>
            <td>The there is no difference:</td>
            <td>
                <button type="button" class="btn btn-info btn-xs col-md-12 col-lg-12">Update</button> <br>
                <button type="button" class="btn btn-danger btn-xs col-md-12 col-lg-12">Delete</button>
            </td>
          </tr>
        </tbody>

如何在这两个按钮之间放置一个空格。 br标签不起作用。如果我放两个br标签，那么它会获得更多空间。

Answer 1

试试这个。

＆＃13;

＆＃13;

.margin-bottom {
  margin-bottom: 5px;
  vertical-align: baseline;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div class="col-sm-4">

  <button type="button" class="margin-bottom btn btn-info btn-xs col-md-12 col-lg-12">Update</button>
  <button type="button" class="btn btn-danger btn-xs col-md-12 col-lg-12">Delete</button>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

尝试

<div class="btn-group">
  <button type="button" class="btn btn-info btn-xs col-md-12 col-lg-12">Update</button>
</div>
<div class="btn-group">
    <button type="button" class="btn btn-danger btn-xs col-md-12 col-lg-12">Delete</button>
</div>

现在应该尝试。

Answer 3

我有2个解决方案。

解决方案＃1：

将width添加到您的td并修正您的标记。 Fiddle

<td width="300">
    <button type="button" class="btn btn-info btn-xs">Update</button>
    <button type="button" class="btn btn-danger btn-xs">Delete</button>
  </td>

解决方案＃2：

使用btn-group。 Fiddle

<div class="btn-group">
    <button type="button" class="btn btn-info btn-xs">Update</button>
    <button type="button" class="btn btn-danger btn-xs">Delete</button>
</div>