Bootstrap 4.0-如何删除元素下方的填充？

Question

最近，我尝试了引导程序（4.0版）。我遇到了一些小问题，尤其是在偏离位置的垂直对齐方式上。使用Google Chrome浏览器元素检查时，我发现在总金额下有填充（如下所示的橙色突出显示）：

此代码是：

    <div class="input-group w-25 float-right">
        <label for="number">Total Amount: </label> 
        <span class="input-group-addon">$</span>
        <input type="number" class="form-control" aria-label="Amount">
    </div>

另一个是：如果有低于$ 12.00公斤的填充物和蓝色按钮“向我购买！”

页脚div的元素似乎偏离了垂直对齐方式：

当我使用Google Elements检查元素时，发现里面有填充物：低于$ 12.00千克和蓝色按钮“买我！

这些的代码是

    <div class="card-footer border-success">
          <h6 class="card-subtitle mb-2 text-muted">$12.00/kg </h6> 
            <div class="input-group">
                <input type="text" class="form-control" placeholder="1" aria-label="unit" aria-describedby="basic-addon2">
                <span class="input-group-addon" id="basic-addon2">units</span> 
                <a href="#" class="btn btn-primary">Buy me!</a>
            </div>
    </div>

因此，我的问题是，有什么方法可以去除底部的多余填充物，以使div中的所有元素彼此对齐？

Answer 1

只需使用Bootstrap 4 间距utils ..

pb-0 = padding-bottom: 0;

要么

mb-0 = margin-bottom: 0;