Pagina Desordenada!!!...

Hola no entiendo porq mi pag se esta desordenando al momento de colocar el preview...He empezado a hacer una nueva y las capas estan corridas y no se ve bien, aqui les dejo mi plantilla a ver si pueden ayudarme a corregir mi error!...

plantilla:

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

<html>



<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<title>Principal</title>
<link rel="stylesheet" href="estilo-uny.css" type="text/css" media="all">


</head>


<body>
<div id="global">

<div id="curva-superior"></div>

<div id="cabecera">

<div id="logotipo">

<a href="index.html">

<div style="width:800px; text-align: center;"><embed type="application/x-shockwave-flash" wmode="transparent" src="http://w303.photobucket.com/pbwidget.swf?pbwurl=http://w303.photobu…" height="240" width="800"><a href="http://rojasvictor.atwebpages.com/plantilla.html" target="_blank"><a href="www.uny.edu.ve" target="_blank"></div>
<div id="publicidad"></div>

</div>

<div id="navegacion">
<ul>

  • Principal
  • Sección 2
  • Sección 3
  • Sección 4

    </div>

    <div id="contenido"><div id="menu">
    <h1>Título de Sección 1</h1><ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3
  • Enlace 4

    </div>

    <h1>Esta será la zona principal de la Web</h1>


    Bueno este es mi segundo vamos a intentar q me quede bonito jeje</p>
    <h2>El tercero tal vez no me quepa</h2>

    Ya voy mas o menos avanzando en este curso, me pidieron que le colocara mas texto al contenido, pero realmente no se que colocarle todavia, espero que esto me quede bien, para que los menus por fin salgan... Ojala esto que llevo sea suficiente!...ahi va un poco mas de invento para rellenar el espacio que esta debajo... y ya me estoy quedando sin nada que decir, nos vemos luego...</p>
    </div>


    <div id="pie">

    <div id="pieuno">
    <ul>
  • Foro Ejemplo
  • Contactos
  • Nos Enlazan

    </div>


    <div id="piedos">pie dos</div>


    <div id="pietres">
    <ul>
  • Directorio
  • TopSite
  • Mapa de la Web

    </div>
    </div>


    <div id="curva-inferior"></div>

    </div>
    </body>
    </html>


    y la hoja de estilos:


    * {margin:0px ; padding:0px ; border: 0px}

    p {text-align: justify}
    h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
    h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}


    body {text-align: center ; background-color: #0000CD ; background-image: url(objetos/fondo2.jpg) ; background-repeat:no-repeat}



    #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: black 1px solid ;
    border-right: black 1px solid ; height:200px}
    #logotipo {background-color: white ; width:280px ; float:left}
    #publicidad {background-color: white ; width:518px ; float:right ; margin-top:px}


    #navegacion {background-color: blue ; 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-left: black 1px solid ; border-right: black 1px solid}
    #contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
    #menu {background-color: yellow ; width: 150px ; float:left ;
    text-align:left ; margin: 3px 10px 3px 3px ;
    background-image: url(objetos/menu-parte-inferior.gif);
    background-position: bottom ; 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-curva-superior.gif)}


    #pie {background-color: white ; border-left: black 1px solid ;
    border-right: black 1px solid ; height: 200px}
    #pie li {list-style: none ; font-size: 12px}
    #pieuno {background-color: white ; float:left ; width:150px}
    #piedos {float:left ; width:498px}
    #pietres {background-color: white ; float:right ; width:150px}



    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ;
    background-repeat: no-repeat ; width:800px ; height: 12px ; overflow: hidden }


    a {color: black; font-size:1em ; text-decoration: none ; display: block }
    a:link {}
    a:visited {color: black ; text-decoration: underline}
    a:hover {color: black; text-decoration: underline ; background-color: silver}
    a:active {color: blue; text-decoration: none}

    #pie a {color: blue; text-decoration:none ; display: block }
    #pie a:link {}
    #pie a:visited {}
    #pie a:hover {color:black ; text-decoration:underline ; background-color: white }
    #pie a:active {color:black}

    #logotipo a {}
    #logotipo a:link {}
    #logotipo a:visited {}
    #logotipo a:hover {background-color: white }
    #logotipo a:active {}