How to center the images in the Owl Carousel

Question

My Owl Carousel contains pictures of different width and height. How do I align them in the middle - both horizontally and vertically?

Answer 1

The solution with display table is OK, but for me the divs on the right and left side slides out from the container. My code is close the same, I changed the table and table-cell to block and inline-block

.owl-stage{
  display: block !important;
}

.owl-item{
  display: inline-block;
  float: none;
  vertical-align: middle;
}

.item{
  text-align: center;
}

The result (all images has different sizes):