leccion 2 no se me queda el pie de pagina al final

se me queda el pie de pagina al lado de la zona principal y se queda todo sin margenes a los lados no se me queda como la del ejemplo

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>page title</title>
<link rel="stylesheet"href="estilo-general.css"type="text/css"media="all">
</head>
<body>
<div id="global">
<div id="cabecera">Bienvenidos a mi web</div>
<div id="navegacion">Barra de Navegación</div>
<div id="contenido">
<div id="menu">
</ul><li><a href="#">enlace 1</a></li><li><a href="#">enlace 2</a></li><li><a href="#">enlace 3</a></li></ul>
</div>
<p>Esta será la zona principal<p/><p>de la webpuesyenuiesw rao ui el puto dia un fer la ma.com tots els dies acabes fet polscom no tinc que parar de escriure escriyure algo
mes pero ja bno se que dir<p/><p>en una mentira matarem a uno<p/>
</div>
<div id="pie">Este es el pié de página</div>
</div>
</body>
</html>* {text-indent:0px;margin:0px; padding:0px; border:0px;}
body {text-align:center;}
#global {widht:800px;margin>:4px auto;}
#cabecera {background-color:pink;}
#navegacion{background-color:gray;}
#contenido {background-color:orange;width:800px;float:left;}
#contenido p{padding:5px 10px 5px 10px;text-indent:15px;}
#menu {background-color:yellow; width:150px; float:left;text-align:left;margin-right:10px;}
#menu li {list-style:none; margin:4px 0px 4px 6px;}
#pie {background-color:brown;}
a {color:brown;text-decoration:none;display:block;}
a:link {}
a:visited{}
a:hover {color:red;text-decoration:underline;background-color:silver;}
a:active {}
p{text-align:justify;}


si alguien pudiera ayudarme gracias de antemano
hola
aqui tu error

#global {widht:800px;margin>:4px auto;}

debe ser:

#global {width:800px;margin:4px auto;}

saludos
gracias por tu ayuda a ver si me fijo un poco mas un saludo[:p]