Background Postitioning

[slapdashgrim]

please help im trying to make a quick template but im stuck becuase in firefox the NAV bar's background image is at the top of the page.

 

this is only my second layout that is tableless so its sorta new to me.

 

it looks fine in IE tho (thats a first)

 

here is a link to the page http://grimhq.com/slapdash/bluebusiness

 

here is the CSS

/*
Author: Slapdashwebdesign.info
Created: 10/29/08
For: Style sheet for Blue Business template
Copyright Slapdash Webdesign 2008
*/
body {font: normal normal normal 13px arial; margin: 0; padding: 0; Background-color:#FFF; color:#565353;}

#con_left h1, #con_right h1{text-align:right;background: #BBBBBB URL('images/headingbg.jpg') no-repeat right;width:100%;height:27px;padding:0 0 0 18px;border-bottom:1px solid #222;margin: 0;font: normal normal 600 17.5px arial;color:#444;}
p{margin: 0 0px 1em 10px;}

a:link,
a:active,
a:visited {color:#79BCFF;}
a:hover {color:#3D3D3D;}

img{border:0;}

#loginboxtop {margin: 17px 0 auto 0; color:#8f8f90;}
.input {font-size:15px; background-color:#e6f0f8;border:1px solid #b8b7b7; color:#cbcbcb;}
.input:focus {border:1px solid #40759d; color:#adadad;}
.submit {font-size:15px; background-color:#7491a8;border:1px solid #6b6a6a; color:#FFF;}

#wrap {text-align: left; width:900px;}

#headimg {width:900px; margin:0; padding:0;}

#topbar {width:900px;background-color:#FFF;}
#topbarleft {height:60px; width:447px; float:left; padding:1px 0px 1px 3px;}
#topbarright {height:60px;width:443px; text-align:right; float:right; padding:1px 7px 1px 0px;}

#nav {background-image:url("images/navbg.jpg"); background-repeat:repeat-x; background-position:20% 0%;height:41px; width:900px;}
#nav ul {margin: 0 0 0 0;}
#nav ul li {display: inline; height:41px;}
#nav ul li a {padding:10px 1em 0px 1em; height:31px; font-size:18px; color:#E0E0E0; text-decoration: none; float: left;}
#nav ul li a:hover{color:#FFF; background-image:url('images/monavbg.jpg'); background-repeat:no-repeat;background-position:top center;}
#current{color:#546349; background-image:url('images/curnavbg.jpg'); background-repeat:no-repeat; background-position:top center;}

.contentbg {}
#content {min-height:37.5em;padding:0px 0px 5px 0px; width:900px;}
#con_left {width:257.5px; float: left; margin: 0; padding-top: 5px; clear: both;}
#con_right {min-height:37.5em;width:519px; margin-left: 328.5px; border-left: 1px solid gray; padding-top: 5px;}

.thumb{margin:1px;}

#footer {clear: both; padding-left:3px; width:897px; height:41px;color:#FFF;background-image:url("images/navbg.jpg");}

 

 

and i have not worked on the content at all so dont judge me lol!

[BoltZ]

What seems to be the error here? In Firefox this site looks normal to me. Also try adding javascript to your form fields onclick and onblur so that they disappear when you click them and click away from them. If you need help coding this just post in the JS section. I can write it for you