Html 助推器衬垫（p-）

当我在列

p-4

上使用填充时，它看起来不均匀，底部的填充似乎比顶部多

例如：

<div class="col-sm-12 col-md-12 col-lg-6 bg-success p-4">
   <h6>Title</h6>
</div>

但是

p-4

应该在顶部、右侧和底部左侧均匀地应用填充。我做错了什么导致这个问题吗

完整代码：

<div class="container">
        <div class="row justify-content-between">
            <div class="col-sm-12 col-md-12 col-lg-6 bg-success pt-4 pb-3">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-danger p-4">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-success p-4">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-danger p-4">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-success p-4">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-danger p-4">
                <h6>Title</h6>
            </div>
        </div>
    </div>

标题
标题
标题
标题
标题
标题
因为
h6
有
页边距底部：.5rem
。为
h6
设置
m-0
，然后查看结果



标题
标题
标题
标题
标题
标题

<div class="container">
        <div class="row justify-content-between">
            <div class="col-sm-12 col-md-12 col-lg-6 bg-success pt-4 pb-3">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-danger p-4">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-success p-4">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-danger p-4">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-success p-4">
                <h6>Title</h6>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-6 bg-danger p-4">
                <h6>Title</h6>
            </div>
        </div>
    </div>