problemas con la separacion del muenu

buenas, pues eso problemas con laseparcion en lso enclaces del menu, aki esta mi pagina

http://testeando2.onlinewebshop.net/plantilla.html

y esta es la del curso para cotejar.

http://www.comocreartuweb.com/html-kit-tutorial/ejemplos/plantilla-…

veran el problema luego luego , y es que la separacion del menu de abajo es mucha, tuve el mismo problema con el menu lateral, y crei solucionarlo , digo crei por que hoara pienseo que al sepracion no es la adecuada, segui en consjeo de base que es poner "todo junto"=entendi a que todo iba en una misma liena no salteado , pero no funciona, tambien lo acomode como lo tiene jorgen pero na, y les digo lo puse como el ,es decir , que veia su codigo de fuente y contaba los espacios para ponerlo como el pero no funciona y luego se me ocurre copiar su codigo y venga funciona ¡¡¡¡¡¡¡¡¡¡¡¡¡¡ por que?????? no entiendo vaya si es por el orden que me aconsejaba Yanet la otra vez , pues lo puse tal cual les pongo mi pagina para ver como lo tengo vean mi codigo de fuente y observaran la acomodacion,(lo de hasta ariiba dodne empiezxa el div de pie se mueve un poco a al izuqierda pero en el kid lo tengo bien) la tengo como jorgen y pero na, esto de la sepracion del menu es mi nemesis que me perturba el sueño y hace que mis calificaciones en la escuela decrescan :cry:

esto me mola por que por ejemplo los codigos si estan mal buscandole le arreglas , pero eso de un orden tan raro no me gusta , por que no sabes bien a bien como arreglarlo :evil: en fin

a otro problmea en el menu lateral donde dice titulo de seccion , se supone ke debo poner un paddin g por hai , pero no hayo dodne , por que no entendi dodne habia que ponerla , la pongo en menu , menu li menu h1 pero se desfasa un poco , no es lo esperado , :shock:
gracias.


<--------------------------------
css

a:hover{color:red; text-decoration:underline;background-color:silver}
a:active{}
body{text-align:center}
#global {width:800px; margin:4px auto}
#curva-superior {background-image: url(objetos/curva-superior.gif); background-repeat:no-repeat; width:800px; height:12px;overflow:hidden}
#cabecera {background-color:white;border-right:black 1px solid;border-left:black 1px solid; height:85px}
#logotipo{width:280px;float:left}
#publicidad{width:518px; float:right;margin-top:25px}
#navegacion {background-color:gray;border:black 1px solid;height:20px}
#navegacion li{float:left;list-style:none;margin:0px 20px 0px 20px }
#navegacion ul{margin-left:180px}
#contenido {background-color:orange;border-right:black 1px solid; border-left:black 1px solid }
#contenido p{padding:5px 10px 5px 10px;text-indent:15px}
p{text-align:justify}
#menu {background-color:yellow; width:150px; float:left; text-align:left;margin-right:3px 10px 3px 3px;background-image:url(objetos/menu-parte-inferior.gif);background-position:bottom;margin:3px}
#menu h1{text-decoration:none; font-size: 12px;background-image:url(objetos/menu-parte-superior.gif)}
#menu li{list-style:none; margin:4px 8px 4px 6px;padding-bottom:5px;font-size:12px}
#pie {background-color:white;border-left:black 1px solid;border-right:black 1px solid;border-top:black 1px solid;height:65px}
#pie li{list-style:none;font-size:12px}
#pieuno{background-color:white;float:left;width:150px;font-size:12px}
#piedos{background-color:silver;float:left;width:498px}
#pietres{background-color:white;float:left;width:150px}
#curva-inferior{background-image:url(objetos/curva-inferior.gif);bakcground-repeat:no-repeat;width:800px;height:12px;overflow:hidden}

mira aver si este codigo te soluciona el prolema si va bien me lo dices ok:


* {
text-indent : 0;
margin : 0;
padding : 0;
border : 0;
}
p {
text-align : justify;
}
h1 {
font-size : 1.2em;
color : blue;
font-weight : bold;
text-decoration : underline;
text-align : center;
}
h2 {
color : blue;
font-weight : bold;
text-decoration : none;
text-align : center;
}
body {
text-align : center;
}
#global {
width : 800px;
margin : 4px auto;
}
#curva-superior {
background-image : url(objetos/curva-superior.gif);
background-repeat : no-repeat;
width : 800px;
height : 12px;
overflow : hidden;
}
#cabecera {
background-color : white;
border-left : 1px solid black;
border-right : 1px solid black;
height : 85px;
}
#logotipo {
width : 280px;
float : left;
}
#publicidad {
width : 518px;
float : right;
margin-top : 25px;
font-size : 16px;
}
#navegacion {
background-color : gray;
border : 1px solid black;
height : 20px;
}
#navegacion li {
float : left;
list-style : none;
margin : 0 20px 0 20px;
}
#navegacion ul {
margin-left : 180px;
}
#contenido {
background-color : orange;
border-left : 1px solid black;
border-right : 1px solid black;
}
#contenido p {
margin : 5px 10px 0 10px;
text-indent : 15px;
}
#menu {
width : 150px;
float : left;
text-align : left;
margin : 3px 10px 3px 3px;
background-image : url(objetos/menu-parte-inferior.gif);
background-position : bottom 0%;
padding-bottom : 5px;
}
#menu li {
list-style : none;
margin : 4px 8px 4px 6px;
}
#menu h1 {
text-decoration : none;
font-size : 12px;
padding-top : 12px;
background-image : url(objetos/menu-parte-superior.gif);
}
#pie {
border-left : 1px solid black;
border-right : 1px solid black;
border-top : 1px solid black;
height : 65px;
}
#pie li {
list-style : none;
font-size : 12px;
}
#pieuno {
float : left;
width : 150px;
list-style : none;
}
#piedos {
float : left;
width : 498px;
}
#pietres {
float : left;
width : 150px;
}
#curva-inferior {
background-image : url(objetos/curva-inferior.gif);
background-repeat : no-repeat;
width : 800px;
height : 12px;
overflow : hidden;
}
a {
text-decoration : none;
display : block;
}
a:hover {
color : red;
text-decoration : underline;
background-color : silver;
}