Свойство Bootstrap для вертикального выравнивания не работает - PullRequest
Новая
       23

Свойство Bootstrap для вертикального выравнивания не работает

0 голосов
/ 02 июня 2018

Очень простой вопрос из документации Bootstrap.Казалось, все работало до сих пор, кроме вертикального выравнивания .На следующих изображениях вы можете увидеть Как это должно быть и Как это выглядит в моем браузере ... Спасибо заранее, за любую помощь. 

   <div class="container">
      <div class="row">
        <div class="col align-self-start">
          One of three columns
        </div>
        <div class="col align-self-center">
          One of three columns
        </div>
        <div class="col align-self-end">
          One of three columns
        </div>
      </div>
   </div>

1 Ответ

0 голосов
/ 02 июня 2018

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

Либо .row должен иметь определенную высоту, либо или некоторое содержимое в столбцах приводит к увеличению высоты строки. 

<div class="container">
    <div class="row" style="height:180px">
        <div class="col align-self-start">
            One of three columns
        </div>
        <div class="col align-self-center">
            One of three columns
        </div>
        <div class="col align-self-end">
            One of three columns
        </div>
    </div>
</div>

Демонстрация: https://www.codeply.com/go/aCGgDtzhdY

...