Как адаптировать картинку под carousel?

Question

[Артём]

Есть такая вот карусель.

Как адаптировать под нее изображения? Если они все будут одного размера. Потому как сейчас корректно отображается только в одном разрешении все, в остальных либо вываливается картинка из карусели, либо становится меньше.

Answer 1

[Илья Рупасов]

Добавить в CSS (ниже bootstrap'a естественно):

.carousel-inner {
height: 100%;
}

Comments

[Артём]

Помогает только частично. При больших разрешениях картинка больше не вываливается. Но при уменьшении все равно уползает, и фон вылезает наружу. i.imgur.com/gAEwkuH.png

[Илья Рупасов]

Артём: на самом деле сейчас ковыряться некогда, вам нужно сделать:
1. растянуть по высоте все дочерние элемент (.carousel .item) и добавить им (overflow: hidden)
2. картинки внутри элемента расстягивать во всю высоту (min-width: 100%; min-height: 100%) - если картинки меньше элемента (.item), то они растянуться как нужно - если больше, то печаль беда. Позиционирование лучше вынести в JS, если конечно нет решения на CSS.