Hola de nuevo, a ver si podéis ayudarme con esto. Estoy en la lección 6 del ejemplo con divs y una vez que he conectado las páginas y arreglado el menu de navegación, el texto y el menu de la capa contenido aparece fuera de sus márgenes laterales, cosa que en el ejemplo no debe ocurrir. Os dejo la hoja de estilo y el código html de una de las páginas por si veis algún error que yo no haya visto. ¡Muchas gracias!
Hoja de estilo:
*{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;}
#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: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:60px;}
#contenido{background-color:orange; border-left:black 1px solid; border-right:black 1px solid;}
#contenido p{margin:5px 10px 0px 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;padding-bottom:5px;}
#menu li{list-style:none; margin:4px; 8px; 4px; 6px;}
#menu h1{text-decoration:none; font-size:12px;background-image:url(objetos/menu-curva-superior.gif);padding-top:12px;}
#pie{border-top:black 1px solid; border-right:black 1px solid; border-left:black 1px solid;height:65px;}
#pie li{list-style:none;font-size:12px;}
#pieuno{float:left;width:150px;}
#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{color:brown; text-decoration:none; display:block;}
a:link{}
a:visited{}
a:hover{color:red; text-decoration:underline; background-color:silver;}
a:active{}
#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{}
Código html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>La historia</title>
<link rel="stylesheet" href="../estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<!--INICIO CODIGO CABECERA -- NO TOCAR-->
<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo"><a href="href="../index.html"><img src="../objetos/logotipo.gif" width="270" height="80" alt="Haz clic aquí para volver a la página de inicio"></a></div>
<div id="publicidad">Bienvenidos a mi web</div>
</div>
<div id="navegacion">
<ul><li><a href="../index.html">Portada</a></li><li><a href="../historia/historia.html">Historia</a></li><li><a href="../discografia/discografia.html">Discografía</a></li><li><a href="../conciertos/conciertos.html">Conciertos</a></li><li><a href="../descargas/descargas.html">Descargas</a></li><li><a href="../foro/foro.html">Foro</a></li><li><a href="../souvenirs/souvenirs.html">Souvenirs</a></li></ul></div>
</div>
<!--FIN DE CODIGO DE CABECERA-->
<div id="contenido">
<!-- INICIO CODIGO DE MENU LATERAL IZQUIERDO - NO TOCAR-->
<div id="menu">
<ul><h1>Título de sección 1</h1><li><a href="#">Enlace 1</a></li><li><a href="#">Enlace 2</a></li><li><a href="#">Enlace 3</a></li><li><a href="#">Enlace 4</a></li></ul></div>
<!-- FIN DE CODIGO DE MENU LATERAL IZQUIERDO -->
<h1>Nuestra historia</h1><p>La banda nació en 1982, cuando tras ver por la tele un concierto de Bruce Springsteen dos chavalotes se digeron... y si aprendemos a tocar algo? Fue entonces cuando Juanito se compró su primera batería y Pepito su primer ampli y guitarra. Tras encontrarse con Pablito y convencerle de que le pidiera el bajo a su tio, empezaron a ensayar en el garaje de uno de ellos.Al principio intentaban tocar sus canciones preferidas, las que sonaban en esos momentos por la radio y cosas así. Más tarde Pepito empezó a escribir algunas letras a las que pusieron música. Así nació la banda, imagino que, igual que muchas otras.</p></div>
<!-- INICIO CODIGO PIE DE PAGINA - NO TOCAR -->
<div id="pie">
<div id="pieuno"><ul><li><a href="#">Foro Ejemplo</a></li><li><a href="#">Contacto</a></li><li><a href="#">Nos enlazan</a></li></ul></div>
<div id="piedos">pie dos</div>
<div id="pietres"><ul><li><a href="#">Directorio</a></li><li><a href="#">Topsite</a></li><li><a href="#">Mapa de la Web</a></li></ul></div>
</div>
<!-- FIN DE CODIGO PIE DE PAGINA -->
<div id="curva-inferior"></div>
</div>
</body>
</html>
Hoja de estilo:
*{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;}
#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: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:60px;}
#contenido{background-color:orange; border-left:black 1px solid; border-right:black 1px solid;}
#contenido p{margin:5px 10px 0px 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;padding-bottom:5px;}
#menu li{list-style:none; margin:4px; 8px; 4px; 6px;}
#menu h1{text-decoration:none; font-size:12px;background-image:url(objetos/menu-curva-superior.gif);padding-top:12px;}
#pie{border-top:black 1px solid; border-right:black 1px solid; border-left:black 1px solid;height:65px;}
#pie li{list-style:none;font-size:12px;}
#pieuno{float:left;width:150px;}
#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{color:brown; text-decoration:none; display:block;}
a:link{}
a:visited{}
a:hover{color:red; text-decoration:underline; background-color:silver;}
a:active{}
#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{}
Código html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>La historia</title>
<link rel="stylesheet" href="../estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<!--INICIO CODIGO CABECERA -- NO TOCAR-->
<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo"><a href="href="../index.html"><img src="../objetos/logotipo.gif" width="270" height="80" alt="Haz clic aquí para volver a la página de inicio"></a></div>
<div id="publicidad">Bienvenidos a mi web</div>
</div>
<div id="navegacion">
<ul><li><a href="../index.html">Portada</a></li><li><a href="../historia/historia.html">Historia</a></li><li><a href="../discografia/discografia.html">Discografía</a></li><li><a href="../conciertos/conciertos.html">Conciertos</a></li><li><a href="../descargas/descargas.html">Descargas</a></li><li><a href="../foro/foro.html">Foro</a></li><li><a href="../souvenirs/souvenirs.html">Souvenirs</a></li></ul></div>
</div>
<!--FIN DE CODIGO DE CABECERA-->
<div id="contenido">
<!-- INICIO CODIGO DE MENU LATERAL IZQUIERDO - NO TOCAR-->
<div id="menu">
<ul><h1>Título de sección 1</h1><li><a href="#">Enlace 1</a></li><li><a href="#">Enlace 2</a></li><li><a href="#">Enlace 3</a></li><li><a href="#">Enlace 4</a></li></ul></div>
<!-- FIN DE CODIGO DE MENU LATERAL IZQUIERDO -->
<h1>Nuestra historia</h1><p>La banda nació en 1982, cuando tras ver por la tele un concierto de Bruce Springsteen dos chavalotes se digeron... y si aprendemos a tocar algo? Fue entonces cuando Juanito se compró su primera batería y Pepito su primer ampli y guitarra. Tras encontrarse con Pablito y convencerle de que le pidiera el bajo a su tio, empezaron a ensayar en el garaje de uno de ellos.Al principio intentaban tocar sus canciones preferidas, las que sonaban en esos momentos por la radio y cosas así. Más tarde Pepito empezó a escribir algunas letras a las que pusieron música. Así nació la banda, imagino que, igual que muchas otras.</p></div>
<!-- INICIO CODIGO PIE DE PAGINA - NO TOCAR -->
<div id="pie">
<div id="pieuno"><ul><li><a href="#">Foro Ejemplo</a></li><li><a href="#">Contacto</a></li><li><a href="#">Nos enlazan</a></li></ul></div>
<div id="piedos">pie dos</div>
<div id="pietres"><ul><li><a href="#">Directorio</a></li><li><a href="#">Topsite</a></li><li><a href="#">Mapa de la Web</a></li></ul></div>
</div>
<!-- FIN DE CODIGO PIE DE PAGINA -->
<div id="curva-inferior"></div>
</div>
</body>
</html>