Css 为什么形状水平居中，但总是粘在顶部？独自创立

我的表格垂直居中有问题。我读过很多教程，但都不适合我。即使是这样，我也不知道为什么。 我是否应该更改页面正文中的某些内容

为什么它水平居中，但总是粘在顶部？

我的代码：

<div class="container">
    <div class="row justify-content-center mt-5">
        <div class="col-md-5">
            <form class="text-center border border-light p-5" action="#!">
                <p class="h4 mb-4">Sign in</p>
                <!-- Email -->
                <input type="text" class="form-control mb-4" name="username" placeholder="Username">
                <!-- Password -->
                <input type="password" class="form-control mb-4" name="password" placeholder="Password">
                <div class="d-flex justify-content-around">
                    <div>
                        <!-- Forgot password -->
                        <a href="">Forgot password?</a>
                    </div>
                </div>
                <!-- Sign in button -->
                <button class="btn btn-info btn-block my-4" type="submit">Sign in</button>
                <!-- Register -->
                <p>Not a member?
                    <a href="">Register</a>
                </p>
            </form>

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

登录

登录
不是会员？

这就是我得到的：

---

与其重复同样的问题，不如花点时间把副本读到最后（我坚持要读到最后）@Temaniaafif我真的做了，伙计！它总是粘在上面。我不知道为什么。你的代码中没有显示你做了什么。我看不到与垂直对齐相关的内容，如副本中所述