CSS vertical align image inside another div (Divi wordpress theme)

2 Views

I am trying to center my image verticaly inside div. I have a set of images that are different heights and widths. I made a boxes 320×230 that displays that images inside them. Images that are bigger have overflow: hidden. But some images that are smaller have gap so I want to center them on this website — > Here

I use this CSS for the DIV that contains image 

.transformations {

max-width:320px;
max-height: 230px;
min-width:320px;
min-height: 230px;
box-shadow: 0 0 50px #0052af;
overflow: hidden;
border: 4px solid #0052af;
}
Post Views: 2

Related posts

1 comment

  1. I have just made some customizations and it works: 

    <div class="img-wrapper">
<img src="http://img.youtube.com/vi/jofNR_WkoCE/maxresdefault.jpg">
</div>

    And css:

    .img-wrapper{
  position: relative;
  overflow:hidden;
  height:425px;
}

.img-wrapper img{
   position: absolute;
   top:-100%; left:0; right: 0; bottom:-100%;
   margin: auto;
}

    That worked for me on Divi wordpress theme.

Comments are closed.