[HTLM&CSS]Agencement menu et en tete

Bonjour,

Je débute en HTML et CSS et je dois dire que l'agencement de mon menu et ma banniere (en tete) me pose de gros soucis.

Ce que je voudrais faire :

-1/ avoir 8 menus de 100px de large, parce que la page fait 800px de large ==> il y a une marge a droite
-2/ avoir tout en haut le menu puis au dessous, collé au menu, la banniere ==> la banniere et les menus sont au meme niveau.
-3/ centrer la banniere qui fait aussi 800px de large, par 130 de haut ==> elle est decalée, pire que les menus.

Voici mon CSS :

body
{
width: 800px;
margin: auto;
margin-top: 0px;
margin-bottom: 10px;
background-color: #660000;
}

p
{
width: 800px;
text-indent: 10px;
font-family: georgia, tahoma, arial, verdana, serif;
font-size: 90%;
text-align: justify;
}

#menu
body {
width: 800px;
margin: auto;
padding: 0px;
background: #990000;
font: 50% verdana, arial, serif;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}

#menu dl {
float: left;
margin: auto;
width: 100px;
height: 40px;
}
#menu dt {
cursor: pointer;
text-align: center;
color: #000000;
background: #990000;
border-left: 2px solid black;
border-right: 2px solid black;
margin: 1px;
height: 40px;
}
#menu dd {
display: none;
border: 1px solid black;
}
#menu li {
text-align: center;
font: 65% verdana, arial, sans-serif;
color: #000000;
background: #990000;
height: 25px;
}
#menu li a{
color: #000000;
background: #990000;
text-decoration: none;
display: block;
height: 25px;
border: 0;
}
#menu dt a {
color: #000000;
background: #990000;
text-decoration: none;
display: block;
height: 40px;
border: 0 none;
}

#menu li a:hover, #menu li a:focus{
background: #000000;
color: #990000;
font-style: italic;
}

#menu dt a:hover, #menu dt a:focus {
background: #000000;
color: #990000;
font-style: italic;
}

#banniere
{
margin: 40px;
width: 100%;
height: 130px;
background-image: url("banniere.jpg");
background-repeat: no-repeat;
}

#corps
{
width: 100%;
margin: auto;
margin-top: 0px;
margin-bottom: 0px;
padding: 10px;
background-color: #333333;
color: #FFFFFF;
}

#corps h3
{
font-weight: bold;
text-align: right;
font-style: italic;
}

#corps h4
{font-size: 100%;
font-weight: normal;
text-align: left;
font-style: normal;
}

Le résultat :

http://img369.imageshack.us/img369/9600/essailf6.jpg

NB: La banniere est bordée de blanc, mais la n'est pas le probleme, il s'agit d'une erreur de ma part avec le logiciel de dessin.

NB: J'ai "masqué" les textes parce que je suis timide :)

si une bonne ame pouvait resoudre ce sac de noeud, je lui en serais tres reconnaissante!!

merci a tous!

Configuration: Windows Vista
Firefox 3.0.1