Jak rozszerzyć karuzelę obrazkową Bootstrap dla dynamicznych rozmiarów wyśrodkowanych obrazów

Próbuję rozszerzyć domyślną karuzelę obrazu Bootstrap, aby obsługiwać obrazy o rozmiarach dynamicznych (maks. 500 x 400), wyśrodkowane zarówno w poziomie, jak iw pionie. Dodatkowo chciałbym zachować oryginalny układ napisów, który zakotwiczy podpis na dole obrazu, przy czym div podpisu będzie rozciągał się całkowicie na obrazie (ale nie dalej).

Zrobiłem skrzypce, które są dość czystą implementacją domyślnej konfiguracji Bootstrap (na końcu sekcji css są tylko 4 dodatkowe style):

http://jsfiddle.net/rdugan/JFBFU/26/

Mogę dość łatwo spełnić wymagania centrowania poziomego i podpisu, dodając otaczający div „inline” dookoła obrazu i podpisu, i używając „text-align: center” na rodzicu. Jednak centrowanie pionowe pozostaje problemem (jak zawsze).

Jako alternatywę próbowałem również użyć 'display: table-cell' (i towarzyszących im stylów centrowania) w różnych div z różnymi wynikami - w niektórych przypadkach zepsułem funkcjonalność karuzeli, podczas gdy w innych osiągam centrowanie obrazu, ale stracić zakotwiczenie napisów.

Wszelkie wskazówki byłyby bardzo mile widziane - walił mnie w głowę przez jakiś czas.

questionAnswers(3)

yourAnswerToTheQuestion