CSS не делает выравнивание изображения в центре с помощью OpenCarousel

Question

Я использую JQuery OpenCarousel для отображения некоторых изображений на веб-странице, но если изображения не такие широкие, как карусель, я хочу, чтобы они были выровнены по центру. Я могу выровнять изображения, когда они находятся вне карусели, только когда они в ней. Карусели использует этот код, чтобы отобразить их:

<div class="RoundRow ocarousel"> 
    <div class="ocarousel_window"> 
     <div style="width: 850px;"><img style="margin:0 auto;display: block;" src="./images/Carousel/Slide1.jpg" /></div> 
     <div style="width: 850px;"><img style="margin:0 auto;display: block;" src="./images/Carousel/Slide2.jpg" /></div> 
    </div> 
</div> 

JQuery OpenCarousel - https://github.com/justinmc/jQuery-Open-Carousel

My Webpage - http://joshblease.co.uk/Apartments/

Answer 1

Ваш img элемент наследует float: left из правила в openCarousel.css (строка 34).

Для того, чтобы правильно отцентрировать изображение, вам нужно сбросить поплавок:

<div class="RoundRow ocarousel"> 
    <div class="ocarousel_window"> 
     <div style="width: 850px;"><img style="float: none;margin:0 auto;display: block;" src="./images/Carousel/Slide1.jpg" /></div> 
     <div style="width: 850px;"><img style="float: none;margin:0 auto;display: block;" src="./images/Carousel/Slide2.jpg" /></div> 
    </div> 
</div>