How to set images in center of carousel (Onsen-UI)

Question

I'm using Onsen-ui with angularjs. I'm trying to set images at center of carousel but they're always aligned at left, here's my code

<ons-carousel direction="horizontal" style="height: 62.5%; background-color: blue;" swipeable auto-scroll overscrollable id="carousel">

<ons-carousel-item style="margin: auto">
  <img src="images/carousel1.jpg" style="margin: auto; height: 100%">
</ons-carousel-item >

<ons-carousel-item style="margin: auto">
  <img src="images/carousel2.jpg" style="height: 100%; margin: auto"> 
</ons-carousel-item>

<ons-carousel-item style="margin: auto">
   <img src="images/carousel3.jpg" style="height: 100%; margin: auto">
 </ons-carousel-item>

please help me to solve this problem

Answer 1

Try

ons-carousel-item {
    text-align: center;
}

If that doesn't work:

ons-carousel-item img {
    margin-left: auto;
    margin-right: auto;
}