2

Допустим есть 4 блока и в каждом по картинке: в первых 3 маленькой высоты и в 4 побольше. Пример блоков Можно ли задать блокам высоту, равную минимальной среди них? Т.е. чтобы последняя картинка уменьшилась до высоты минимальной.

1
  • Без JS нельзя. Используйте JS или задавайте фиксированную высоту.
    – NoSkill
    8 сен 2020 в 13:25

2 ответа 2

1

js

let flexContainer = document.querySelector('.flex-container');
let flexEl = [...flexContainer.children]

let mHeight = Math.min(...flexEl.map(e => {
    return parseInt(e.clientHeight);
}))

flexEl.forEach(e => {
    e.style.height = mHeight + 'px'
})

html

<section class="flex-container">
    <div class="flex-container__el"></div>
    <div class="flex-container__el"></div>
    <div class="flex-container__el"></div>
</section>
1

Думаю в этом случае лучше всего задать фиксированную величину, это можно сделать с помощью свойства flex-basic, в нем, если не ошибаюсь, ты задаешь необходимую ширину, а высота автоматически уменьшится

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.