Hola, estuve recorriendo el foro y no dí con la solución, si alguien puede ayudarme, gracias.
Problema: Keda una separación entre la cabecera y la barra de navegación, no pude dar con la respuesta, hasta probé tocando el códgio en css y en la plantilla.
Acá va el codigo de plantilla:
<!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="curva-superior"></div>
<div id="cabecera">
<div id="logotipo"></div>
<div id="publicidad"></div>Bienvendios a mi Web</div>
</div>
<div id="navegacion">Barra de navegación</div>
<div id="contenido">
<div id="menu">
<ul>Enlace 1 Enlace 2 Enlace 3
</div>
<h1>Esta será la zona principal de la web</h1>
Tras esta aclaración, vamos a incluir un par de párrafos más a continuación de ese. Ya sabes, has de poner y al principio y al final de cada uno para que el navegador sepa donde empiezan y terminan. Escribe un par de párrafos que tengan bastante texto, al menos lo suficiente como para sobrepasar lo que ocupa el menú de la izquierda.
Si escribes lo suficiente en cantidad, conseguirás ver este.</p>
<h2>Estes es el tercer párrafo</h2>
Los títulos aparecen como elementos de una sola línea, o mejor dicho, no dejan que otra cosa como por ejemplo un párrafo, continue a su derecha, mandándolo directamente a la línea siguiente. Lo ves en la vista previa?</p>
</div>
<div id="pie">Este es el pie de la página</div>
<div id="curva-inferior"></div>
</div>
</body>
</html>
Acá el del CSS
* {margin:0px ; padding:0px ; border:0px}
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: black 1px solid ; border-right: black 1px solid}
#navegacion {background-color:gray ; width: 800px ; border: black 1px solid}
#contenido {background-color:orange ; width:800px ; 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}
#menu li {list-style:none ; margin: 4px 0px 4px 6px}
#pie {background-color:white ; width: 800px ; border-left: black 1px solid ; border-right:black 1px solid ; border-top:black 1px solid}
a {color:brown ; text-decoration:none ; display:blcok}
a:link {}
a:visited {}
a:hover {color:red ; text-decoration:underline ; background-color:silver}
a:active {}
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}
#curva-inferior {background-image: url(objetos/curva-inferior.gif) ; background-repeat: no-repeat; width:800px ; height:12px ; overflow:hidden}
Problema: Keda una separación entre la cabecera y la barra de navegación, no pude dar con la respuesta, hasta probé tocando el códgio en css y en la plantilla.
Acá va el codigo de plantilla:
<!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="curva-superior"></div>
<div id="cabecera">
<div id="logotipo"></div>
<div id="publicidad"></div>Bienvendios a mi Web</div>
</div>
<div id="navegacion">Barra de navegación</div>
<div id="contenido">
<div id="menu">
<ul>
</div>
<h1>Esta será la zona principal de la web</h1>
Tras esta aclaración, vamos a incluir un par de párrafos más a continuación de ese. Ya sabes, has de poner y al principio y al final de cada uno para que el navegador sepa donde empiezan y terminan. Escribe un par de párrafos que tengan bastante texto, al menos lo suficiente como para sobrepasar lo que ocupa el menú de la izquierda.
Si escribes lo suficiente en cantidad, conseguirás ver este.</p>
<h2>Estes es el tercer párrafo</h2>
Los títulos aparecen como elementos de una sola línea, o mejor dicho, no dejan que otra cosa como por ejemplo un párrafo, continue a su derecha, mandándolo directamente a la línea siguiente. Lo ves en la vista previa?</p>
</div>
<div id="pie">Este es el pie de la página</div>
<div id="curva-inferior"></div>
</div>
</body>
</html>
Acá el del CSS
* {margin:0px ; padding:0px ; border:0px}
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: black 1px solid ; border-right: black 1px solid}
#navegacion {background-color:gray ; width: 800px ; border: black 1px solid}
#contenido {background-color:orange ; width:800px ; 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}
#menu li {list-style:none ; margin: 4px 0px 4px 6px}
#pie {background-color:white ; width: 800px ; border-left: black 1px solid ; border-right:black 1px solid ; border-top:black 1px solid}
a {color:brown ; text-decoration:none ; display:blcok}
a:link {}
a:visited {}
a:hover {color:red ; text-decoration:underline ; background-color:silver}
a:active {}
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}
#curva-inferior {background-image: url(objetos/curva-inferior.gif) ; background-repeat: no-repeat; width:800px ; height:12px ; overflow:hidden}