Overlapping png Element Not Working in IE

Hi

I have a header that contains a logo which is in png format. I want this header and image to overlap the nav content area below it, as the logo is in PNG format this means the lower have of the letters should show ‘on top’ of the nav section.

This works fine in firefox, but in IE the logo does not overlap but is chopped off by the nav section. I am using margin-bottom:-25px; to achieve this, what else could I use for the same effect?

screenshot
[url]http://farm4.static.flickr.com/3624/4081573992_e3e53fdf6e.jpg[/url]

[CODE] <div id=”header”>
<h1><a href=”Shop.aspx” title=”Home”>RubyTuesdayGifts – designer gift boutique – stocking unique and funky gifts</a></h1>
</div><!– close #header –>

<div class=”center”>

<div id=”nav”>

<span id=”nav_shop”>
Shop the catalog
</span>

<span id=”nav_participate”>
About our Retail Store
</span>

<span id=”nav_info”>
Info
</span>

<span id=”nav_login”>
Sign In or Join
</span>

</div><!– close #nav –>[/CODE]

Also in #CSS _↴