#html #css #bootstrap-4 #frontend #height
#HTML #css #bootstrap-4 #интерфейс #высота
Вопрос:
Я разрабатываю проект, в котором я использую карточки bootstrap. Я также должен сделать его совместимым с Chromium 57.xx по некоторым причинам в компании, в которой я работаю — вот где возникла проблема. Я использую height: 100% для карточек, и они абсолютно одинаковой высоты в Chrome, Firefox, Edge, Opera и т.д. У меня недостаточно репутации для публикации изображений, поэтому я буду размещать ссылки на изображения. Когда я использую Chromium, это выглядит так:
https://i.epvpimg.com/cUzQdab.png
Хотя они имеют одинаковую высоту, высота намного выше, чем должна быть.
Чего я хочу достичь, так это этого:https://i.epvpimg.com/dTKdgab.png
Когда я отключаю height 100, высота родительского элемента выглядит следующим образом: https://i.epvpimg.com/ppkjaab.png
Есть идеи? Спасибо.
Ответ №1:
Я исправил это, добавив класс d-flex к родительскому элементу, удалил класс h-100 из дочернего элемента и добавил класс flex-fill к дочернему элементу. Работает отлично.