margin IE vs FF

[chechu]

Hey all,

I designed a page for IE, and alll works fine, but in FF it looks slightly different. I have searched a lot via Goole and DD, but can't find the solution. Can anyone help me out with this, please?

This is a link to the example page: test

This is the css:

* {
padding:0; 
margin:0;
} 

body  {
font : 10px Trebuchet MS, Arial, Helvetica, sans-serif;
color : #666666;
text-align:center;
}

#content {
height : 538px;
width : 720px;
margin-left: auto;
margin-right: auto;
}



/* CHOICE */



#index {
background : url(trashy4.png) no-repeat;
width : 720px;
height : 538px;
}

#gallery {
background : url(trashy6.png) no-repeat;
width : 720px;
height : 538px;
}



/* CONTACT */



#contact {
height : 21px;
margin : 10px 0 0 590px;
}
#contact img {
border : 0;
}


/* MUSIC */


#music {
margin : 15px 0 0 435px;
}


/* GALLERY INDEX */


#slides {
height : 120px;
width : 118px;
margin : 260px 0 0 475px;
}


/* GALLERY CONTENT */


#screen1 {
height : 116px;
width : 674px;
margin : 264px 0 54px 20px;
background:#fff;
}
#screen2 {
height : 210px;
width : 674px;
margin : 202px 0 0 20px;
background:#fff;
}

#screen2 #form {
width : 305px;
height: 150px;
text-align:left;
float : left;
margin : 35px 70px 0 50px;
}
#screen2 #form p{
font : 10px Trebuchet MS, Arial, Helvetica, sans-serif;
color : #666666;
}
#screen2 #form a{
font : 10px Trebuchet MS, Arial, Helvetica, sans-serif;
color : #666666;
text-decoration:none,
}
#screen2 #form a:hover{
font : 10px Trebuchet MS, Arial, Helvetica, sans-serif;
color : #666666;
text-decoration:underline,
}
#screen2 #form input {
width : 300px;
margin-top : 5px;
text-align : left;
border : 1px solid #ccc;
font : 10px Trebuchet MS, Arial, Helvetica, sans-serif;
color : #565656;
}
#screen2 #form textarea {
width : 300px;
height : 50px;
margin-top : 5px;
text-align : left;
border : 1px solid #ccc;
font : 10px Trebuchet MS, Arial, Helvetica, sans-serif;
color : #565656;
}
#screen2 #data {
height:110px;
width: 200px;
float : left;
display : inline;
margin : 40px 0 0 0;
padding:0 0 0 20px;
text-align:left;
border-left:1px solid #000;
font : 10px Trebuchet MS, Arial, Helvetica, sans-serif;
color : #565656;
}


/* MENU INDEX */


#menu {
width : 720px;
height : 21px;
margin : 50px 0 0 0;
padding : 0 0 0 320px;
}
#menu img {
margin : 0 15px 0 0;
border : 0;
}

/* MENU CONTENT */


#menu2 {
width : 720px;
height : 21px;
margin : 22px 0 0 0;
padding : 0 0 0 320px;
}
#menu2 img {
margin : 0 15px 0 0;
border : 0;
}

[chechu]

I saw in an onld answer of Jschuer that adding !important might be a solution, but that doesn't work.
Any ideas please ?