Imposing a div over an image

My content is under my graphic

[plopsybunny]

Hi there,

I'm new and hopefully asking a really dumb question which will be answered simply by someone out there ;)

I have an image with an image mapped menu at the bottom and space for content above.

I have a div created which shows nicely in the frontpage preview and also in IE. However the div is underneath the image in firefox.

How do I bring the div back into line in firefox?

code shown below:

*******************************************

<div align="center">
<img border="0" usemap="#Menu" src="IMAGES/Contact.jpg" width="500" height="568" border="0">
<div id="main" align="left">
<p class="bodytext">You can contact Nikki using one of the following
ways:<br> <br>
Email: <a href="mailto:[e-mail]">[e-mail]</a><br><br>
OR<br><br>
<a href="mailto:[e-mail]">[e-mail]</a></p>
<p class="bodytext"><b>Mobile:</b> #*$!xx #*$!#*$!</p>
</div>

</div>
<map name="Menu">
<area shape="rect" coords="7,426,102,448" href="biography.html">
<area shape="rect" coords="102,426,180,448" href="gallery.html">
<area shape="rect" coords="180,426,310,448" href="houseofelise.html">
<area shape="rect" coords="310,426,359,448" href="news.html">
<area shape="rect" coords="359,426,419,448" href="listen.html">
<area shape="rect" coords="419,426,492,448" href="venues.html">

<area shape="rect" coords="3,499,60,520" href="contact.html">
<area shape="rect" coords="62,499,127,520" href="booking.html">
<area shape="rect" coords="129,499,190,520" href="sitemap.html">
<area shape="rect" coords="390,499,499,567" href="index.html">
</map>
***********************************

Many thanks :)

[edited by: Robin_reala at 7:47 pm (utc) on Mar. 17, 2007]
[edit reason] Removing URLs [/edit]

[plopsybunny]

The CSS for my query is....

body {
background-color: #ffffff;
background-image: url(IMAGES/Contact.jpg);
margin: 0;
padding: 0;
}

#main {
font-family: Verdana, sans-serif;
font color: #000000;
position:absolute;
top: 80px;
left: 380px;
overflow:auto;
padding:5px 5px 5px 5px;
width:325px;
height:350px
}

[simonuk]

You have a of html errors which never helps solving bugs so I didn't go too deep into the problem.

Using "z index" with absolute or relative positioning types will force a layer to show in front or behind another layer so you might want to look into it as an option.