Bootstrap: Carousel height resizes when slide images have different sizes/ratios

[tispratik]

Seems like a lot of people are facing problems with heights of the images/carousel for responsive design.
Most implement a custom solution. I think we should standardize on a solution and implement it in core.

http://stackoverflow.com/questions/13391566/twitter-bootstrap-carousel-different-height-images-cause-bouncing-arrows
https://coderwall.com/p/uf2pka/normalize-twitter-bootstrap-carousel-slide-heights
http://parkhurstdesign.com/sites/bootstrapsandbox/slider-fixed.php
http://arturssmirnovs.com/blog/bootstrap-carousel-100-height-and-width/

[cvrebert]

One potential difficulty I foresee is dealing with slides which are dynamically added/removed from the Carousel's DOM.

[cvrebert]

@h20ld3n Please use StackOverflow, IRC, Slack, or similar for personal support questions, rather than this issue tracker. See https://github.com/twbs/bootstrap/blob/master/CONTRIBUTING.md#using-the-issue-tracker

[mdo]

I think the solution to this is advising folks in the docs to ensure content is the same height in their implementation. That means same-sized images, setting dimensions on the slides themselves, etc.

[Johann-S]

For your information it's the same behavior in V3

[Cyberskout99]

mdo's answer is technically correct and supports cvrebert's foresight suggesting that dynamically generated elements are not supported for the Carousel feature. No further information has been provided to indicate the contrary. The issue persists in Bootstrap v3.3.7 as of this writing, July 2018.