Center position image over a div

<img src="logo.jpg">
<div class="fadehover">
    <div class="a" ><img src="kulte_gray.jpg" /></div>
    <div class="b" ><img src="kulte.jpg" /></div>
</div>

Actually I want to center the image exactly above the div container. Ok i tried with a simple <center> tag it works开发者_Go百科 but im not sure if this is the smart solution for all browsers. Any ideas? smthing like align it over the div?

<style>
    #logo {
        display: block;
        margin: 0 auto;
    }
</style>

↑ This will center the #logo within its parent container.

<div class="fadehover">
    <img src="logo.jpg" id="logo">
    <div class="a" ><img src="kulte_gray.jpg" /></div>
    <div class="b" ><img src="kulte.jpg" /></div>
</div>

OR:

<!-- If you cannot put #logo into .fadehover
     for some reason -->
<div id="same-width-as-fadehover">
    <img src="logo.jpg" id="logo">
</div>
<div class="fadehover">
    <div class="a" ><img src="kulte_gray.jpg" /></div>
    <div class="b" ><img src="kulte.jpg" /></div>
</div>