Need to center image in web page via CSS

Question

I'd like to center an image in a page both vertically and horizontally even when the browser is resized.

Currently, I use this CSS:

.centeredImage {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -150px;
}

And this HTML:

<img class="centeredImage" src="images/logo.png">

It centers in FF but not IE (image center is placed at upper left corner). Any ideas?

-Robot

Answer 1

the universal KISS ("keep it simple and stupid") way:

<p style="text-align: center;"> <img src="myImage.png" /></p>