How to extend Twitter Bootstrap image carousel for dynamically sized, centered images

Question

I\'m trying to extend the default Bootstrap image carousel to support dynamically sized images (500x400 max), centered both horizontally and vertically. Additionally, I\'d like

Answer 1

You can center horizontally with these rules:

.carousel-inner { text-align: center; }

.carousel .item > img { display: inline-block; }

For vertical aligning you should check out this: http://www.student.oulu.fi/~laurirai/www/css/middle/

And for keeping the image aspect ratio on resizing you just have to change only the width or only the height of the image not both at a time and it will resize with its original ratio.