Как в bootstrap 5 прижать блок к правому краю?

В Bootstrap 5 для прижатия блока к правому краю можно использовать классы из системы сеток.

Если вам необходимо прижать только один блок к правому краю, вы можете использовать класс ms-auto, который устанавливает отступ слева margin-left: auto для элемента. Вот пример:

<div class="container">
  <div class="row">
    <div class="col">
      <!-- Ваш контент здесь -->
    </div>
    <div class="col ms-auto">
      <!-- Контент, который нужно прижать к правому краю -->
    </div>
  </div>
</div>

В этом примере один блок будет занимать основную часть ширины, а второй блок будет прижат к правому краю.

Если вам нужно прижать все блоки в строке к правому краю, вы можете также использовать класс justify-content-end, который устанавливает выравнивание элементов по горизонтали в конечную точку (правый край). Вот пример:

<div class="container">
  <div class="row justify-content-end">
    <div class="col">
      <!-- Контент, который прижат к правому краю -->
    </div>
    <div class="col">
      <!-- Контент, который прижат к правому краю -->
    </div>
  </div>
</div>

В этом примере все блоки в строке будут прижаты к правому краю.

Кроме того, в Bootstrap 5 вы также можете использовать классы text-end и float-end для аналогичного эффекта. Например:

<div class="container">
  <div class="row">
    <div class="col">
      <p class="text-end">Этот текст прижат к правому краю.</p>
    </div>
  </div>
</div>

или

<div class="container">
  <div class="row">
    <div class="col">
      <p class="float-end">Этот текст прижат к правому краю.</p>
    </div>
  </div>
</div>

Оба этих класса прижимают текст к правому краю.

Надеюсь, эти примеры помогут вам прижать блоки к правому краю при использовании Bootstrap 5.