请问移动 h5 overflow-y: scroll +下边距为什么会导致内容高度偏移（失真？）如何解决？

父级容器 48px 高度，子容器 44px 高度 + 4px 下边距

一、父容器设置 overflow-y: auto，高度应该是刚刚好容纳第一个子容器的，但是却展示了第二个子容器大约 1px 的内容

.father {
    height: 48px;
    overflow-y: auto;
}

.child {
    color: #fff;
    font-size: 14px;
    margin-bottom: 4px;
    padding: 2px 8px;
    border-radius: 12px;
    display: inline-block;
    background-color: rgba(0, 0, 0, 0.4);
}

二、父容器去掉滚动能够解决问题

.father {
    height: 48px;
}

问：在保留 overflow-y: scroll 的前提下，能否解决掉 1px 的问题呢？谢谢

回答一楼的问题：父容器确实是 48px，我在 codepen 和重写一个 html 都没有问题

然后去调整下边距发现奇数的时候会消失，偶数的时候会出现。

非 h5 环境下没有这个问题