How to vertically center elements in Bootstrap 5?

Question

HTML

Hey!
I've already tried this and that, but I can't find the answer.

I need to vertically center 3 buttons. So that it would not move out every time at a different resolution.
It turned out horizontally with grief in half.

Please suggest a solution. An example is desirable.
My example of what I made up myself is below.

<div class="container">
        <div class="col-12 mb-5"></div>
            
                <!-- надпись 1-->
            <div class="row justify-content-center">
                <div class="col-auto mb-3">
                    button type="button" class="btn btn-warning">Кнопка1</button>
                </div>
            </div>

              <!-- надпись 2-->
            <div class="row justify-content-center">
                <div class="col-auto">             
                  button type="button" class="btn btn-warning">Кнопка3</button>                    
                </div>
            </div>

              <!-- надпись3 -->
            <div class="row justify-content-center">
                <div class="col-auto">
                    <button type="button" class="btn btn-warning">Кнопка3</button>
                </div>
            </div>
    </div>

Answer 1

The .align-items-center class is responsible for vertical centering in the bootstrap ( here is a link to this info in Russian )
Important!
Your bootstrap layout is wrong. Need like this:

<div class="container">
  <div class="row justify-content-center align-items-center">

    <!-- надпись 1-->
    <div class="col-auto mb-3">
      <button type="button" class="btn btn-warning">Кнопка1</button>
    </div>
    <!-- надпись 2-->
    <div class="col-auto mb-3">
      <button type="button" class="btn btn-warning">Кнопка2</button>
    </div>
    <!-- надпись 3-->
    <div class="col-auto mb-3">
      <button type="button" class="btn btn-warning">Кнопка3</button>
    </div>
  </div>
</div>

.row is only used to wrap .col-auto/col-md-4...