Kirill Udaltsov

<textarea>

Например, в Bootstrap:

<div class="form-group">
  <label for="exampleFormControlTextarea1">Example textarea</label>
  <textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
</div>

https://getbootstrap.com/docs/4.0/components/forms/

В Bootstrap есть два вида контейнеров, баннер, как и весь контент у тебя находится в контейнере с фиксированной шириной .container, а шапка сайта, в которой содержится меню обернута в .container-fluid с резиновой шириной, то есть он тянется.



Тебе нужно изменить .container-fluid на .container и внутри контейнера в div с классом flex-middle поставить css-свойство justyfi-content: between чтобы выравнять содержимое шапки по краям



https://getbootstrap.com/docs/4.0/layout/overview/

Первый способ:

body {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

Второй способ:

.btn-group-vertical {
    position: absolute;
    top: calc(50% - 56px);
    left: calc(50% - 38px);
}

56px - половина высоты блока с кнопками
38px - половина ширины блока с кнопками