все div с одинаковой высотой во flexbox с нижней

Question

все div с одинаковой высотой во flexbox с нижней

Не думайте, что есть какой-то прямой метод, чтобы получить последний день, но вы можете сделать что-то вроде этого:

var dateInst = new moment();
/**
 * adding 1 month from the present month and then subtracting 1 day, 
 * So you would get the last day of this month 
 */
dateInst.add(1, 'months').date(1).subtract(1, 'days');
/* printing the last day of this month's date */
console.log(dateInst.format('YYYY MM DD'));

1

css twitter-bootstrap css3 flexbox bootstrap-4

задан Michael_B 5 March 2019 в 00:25

2 ответа

Другие вопросы по тегам:

css twitter-bootstrap css3 flexbox bootstrap-4

Похожие вопросы:

score 0 · Answer 1

Не существует способа одинакового выравнивания контента у детей отдельных родителей flexbox. Однако вы можете сделать столбцы также контейнером flexbox, используя d-flex, а затем mt-auto (margin-top:auto), чтобы перенести даты в конец столбцов.

        <div class="col-sm-12 col-md-3 d-flex flex-column">
            <div class="row">
                <div class="col-lg-12">
                    here are different heights possible
                </div>
            </div>
            <div class="row mt-auto">
                <div class="col-lg-12 date">
                    date
                </div>
            </div>
        </div>

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

Также см .: Самозагрузка 4 карты - тело вертикального выравнивания с переменной строкой заголовка строки

score 0 · Answer 2

Вы можете растянуть контейнер date, чтобы заполнить оставшееся пространство строки с помощью flex:1, и выровнять все содержимое снизу с помощью align-items:flex-end: -)

Я исправил ваш пример чуть ниже, вам на самом деле не нужно для добавления .row в пределах wrapper - col-lg-12 должно быть всем, что вам нужно, чтобы перейти в следующий ряд.

Я только добавил border:white 1px solid;, чтобы вы могли видеть, как работает мое решение - вы можете просто проигнорировать это.

[10]