css margin-top and margin-bottom not working

Question

Here is code:

.HUD {
    height: 100%;
    width: 100%;
    overflow: hidden;
}

.Smart_HudWarp{
    display: block;
    height: fit-content;
    margin-top: auto;
    margin-bottom: auto;
}

<div class="HUD">
    <div class="Smart_HudWarp">
            some elements....
    </div>
</div>

I'm trying to center div inside another one, the problem is - margins doesn't show up, what i'm missing?