How to center an img inside a div

Question

I\'m trying something that should be pretty easy but i can\'t figure out how to make it.

I have html source like this:

  &l         


        
      

Answer 1

If the image dimensions are static then something like this would work for you

.product img {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 300px;
   height: 300px;
   margin-top: -150px; /* Half the height */
   margin-left: -150px; /* Half the width */
}