Question

I have the following CSS code being used for centering an <img> tag

.img {
      position:absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      margin: auto;
}

The above code works an intended in Firefox, Safari, Chrome and IE8.

But it does not work in Opera

If i add padding-top to the above code, it messes up the other browsers but opera works.

How do I target Opera for padding-top or solve the centering issue with Opera ?

Answer 1

If all you’re trying to do is center the image all you need to do is:

img{
  display: block;
  margin: 0 auto;
}