Problema con el pie de pagina

Shing · 22 Jun 2008, 23:09 · Solicitar retirada

Acabo de terminar el curso paso a paso que esta en su web y he descubierto que tengo un problema, intente resolverlo por mi cuenta pero no soy lo suficientemente bueno en esto como para solucionarlo xD

aqui les dejo una foto

[contenido no disponible]
[contenido no disponible]

les agradezco su ayuda :D!

davissbrocen · 23 Jun 2008, 00:01 · Solicitar retirada

¿podrías copiarnos los códigos de la hoja de estilos y de la página? es para ver si has escrito algo mal o te falta algo. :wink:

Shing · 23 Jun 2008, 00:49 · Solicitar retirada

davissbrocen escribió:¿podrías copiarnos los códigos de la hoja de estilos y de la página? es para ver si has escrito algo mal o te falta algo. :wink:

aqui te los dejo

estilo-general.css

* {text-indent:0px ; margin:0px ; padding:0px ; border:0px }
body {text-align: center }
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-superior { background-image: url(objetos/curva-superior.gif) ;
                  background-repeat: no-repeat ;
                  width:800px ; 
                  height: 12px ;
									overflow: hidden }
#curva-inferior { background-image: url(objetos/curva-inferior.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   {background-color: brown ; width:280px ; float: left }
#logotipo a         {}
#logotipo a:link    {}
#logotipo a:visited {}
#logotipo a:hover   {background-color: white }
#logotipo a:active  {}
#publicidad {background-color: pink ; 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 10px }
#navegacion ul { margin-left: 190px }
#contenido {background-color: orange ; border-left: black 1px solid ; border-right: black 1px solid }
#pie     {border-left:  black 1px solid ; border-right: black 1px solid ; 
          border-top:   black 1px solid ; height: 65px }
#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}
#pie li {list-style: none ; font-size: 10px }
#pieuno  {background-color: white ; float:left ; width:150px }
#piedos  {background-color: white ; float:left ; width:498px }
#pietres {background-color: white   ; float:left ; width:150px }
#global {width:800px ; margin: 4px auto }
#menu {background-color: yellow ; width: 150px ; float:left ; text-align:left ;
 margin-right: 10px ; margin: 3px 10px 3px 3px ;
 background-image: url(objetos/menu-parte-inferior.gif) ;
 background-position: bottom ;
 padding-bottom:5px }
#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 }
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
#estadisticas {float: left ; width: 18px }
a         {color: brown ; text-decoration:none ; display: block }
a:link    {}
a:visited {}
a:hover   {color:red ; text-decoration:underline ; background-color: silver}
a:active  {}

plantilla.html

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

<html>
<head>
<title>Plantilla</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<link rel="stylesheet" href="estilo-menu-desplegable.css" type="text/css" media="all">
<script language="javascript" src="no-tocar.txt"          type="text/javascript"></script>
<script language="javascript" src="numero-de-menus.txt"   type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<body onload="init();">
<div id="global">
	<div id="curva-superior"></div>
  <div id="cabecera">
			 <div id="logotipo">[url="plantilla.html"][img]objetos/logotipo.gif[/img][/url] </div>
			 <div id="publicidad">Bienvenidos a mi Web</div>
	</div>
  <div id="navegacion">
	<ul>[*] [url="#"] Seccion 1[/url][*] [url="#"] Seccion 2[/url][*] [url="#"] Seccion 3[/url][*] [url="#"] Seccion 4[/url][/list]
	</div>
	<div id="contenido">
			 <div id="menu">
			 			<ul><h1>Titulo de Seccion 1</h1>[*] [url="#"]Enlace 1[/url][*] [url="#"]Enlace 2[/url][*] [url="#"]Enlace 3[/url][*] [url="#"]Enlace 4[/url][/list]
			</div>
	<h1>Esta será la zona principal de la web</h1>
	

Este es mi segundo párrafo. Acabo de poner un punto
	 y en cambio sigue siendo un párrafo pues no le he colocado
	  aún la etiqueta de cierre. Voy a ponersela justo aquí.</p>
	<h2>Y este es el tercer párrafo</h2>

 En pocas lecciones aprenderé
	 a darle margenes para separarlos unos de otros, e incluso
	  hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.</p>
	

Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens
	 nos enseñe a ponerlos alineados a la izquierda, o justificados.
	  Así esto parece una poesia! je je je.</p>
	</div>
	<div id="pie">
		<div id="pieuno">
	 			 <ul>
				 		 [*][url="#"]Foro Ejemplo[/url][*][url="#"]Contactos[/url][*][url="#"]Nos Enlazan[/url]
				 [/list]
		</div>
		<div id="piedos"> pie dos </div>
		<div id="pietres">
  			 <ul>
    		 		 [*][url="#"]Directorio[/url][*][url="#"]TopSite[/url][*][url="#"]Mapa de la Web[/url]
 				 [/list]
		</div>
	<div id="curva-inferior"></div>
</div>
<script language="javascript" src="definir-menus.txt" type="text/javascript"></script>
<div id="estadisticas">
		 <a id="mws4527948" href="http://webstats.motigo.com/">
		 [img]http://m1.webstats.motigo.com/n.gif?id=AEUXTAyzx2E2NXwHxhxrN86ZXdbg[/img]</a>
		 <script type="text/javascript" src="http://m1.webstats.motigo.com/c.js?id=4527948"></script>
</div>
</body>
</html>

davissbrocen · 23 Jun 2008, 00:54 · Solicitar retirada

para el fallo de la parte derecha (donde lo blanco está un poquito más a la derecha que lo naranja) puedes probar quitándole un pixel de ancho a una de las capas del pie ( #pieuno #piedos #pietres, aunque solo un pixel a uno de los tres ) esto es porque 150+150+498=798+3(líneas)=401, por lo que sobra un píxel, para lo otro creo que influye la imagen esa que tienes puesta al final del todo que es?

Raulyure · 23 Jun 2008, 03:20 · Solicitar retirada

estilo-general.css

* {text-indent:0px ; margin:0px ; padding:0px ; border:0px }
body {text-align: center }
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-superior { background-image: url(objetos/curva-superior.gif) ;
                  background-repeat: no-repeat ;
                  width:800px ; 
                  height: 12px ;
									overflow: hidden }
#curva-inferior { background-image: url(objetos/curva-inferior.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   {background-color: brown ; width:280px ; float: left }
#logotipo a         {}
#logotipo a:link    {}
#logotipo a:visited {}
#logotipo a:hover   {background-color: white }
#logotipo a:active  {}
#publicidad {background-color: pink ; 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 10px }
#navegacion ul { margin-left: 190px }
#contenido {background-color: orange ; border-left: black 1px solid ; border-right: black 1px solid }
#pie     {border-left:  black 1px solid ; border-right: black 1px solid ; 
          border-top:   black 1px solid ; height: 65px }
#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}
#pie li {list-style: none ; font-size: 10px }
#pieuno  {background-color: white ; float:left ; width:150px }
#piedos  {background-color: white ; float:left ; width:498px }
#pietres {background-color: white   ; float:left ; width:150px }
#global {width:800px ; margin: 4px auto }
#menu {background-color: yellow ; width: 150px ; float:left ; text-align:left ;
 margin-right: 10px ; margin: 3px 10px 3px 3px ;
 background-image: url(objetos/menu-parte-inferior.gif) ;
 background-position: bottom ;
 padding-bottom:5px }
#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 }
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
#estadisticas {float: left ; width: 18px }
a         {color: brown ; text-decoration:none ; display: block }
a:link    {}
a:visited {}
a:hover   {color:red ; text-decoration:underline ; background-color: silver}
a:active  {}

plantilla.html

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

<html>
<head>
<title>Plantilla</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<link rel="stylesheet" href="estilo-menu-desplegable.css" type="text/css" media="all">
<script language="javascript" src="no-tocar.txt"          type="text/javascript"></script>
<script language="javascript" src="numero-de-menus.txt"   type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<body onload="init();">
<div id="global">
	<div id="curva-superior"></div>
  <div id="cabecera">
			 <div id="logotipo">[url="plantilla.html"][img]objetos/logotipo.gif[/img][/url] </div>
			 <div id="publicidad">Bienvenidos a mi Web</div>
	</div>
  <div id="navegacion">
	<ul>[*] [url="#"] Seccion 1[/url][*] [url="#"] Seccion 2[/url][*] [url="#"] Seccion 3[/url][*] [url="#"] Seccion 4[/url][/list]
	</div>
	<div id="contenido">
			 <div id="menu">
			 			<ul><h1>Titulo de Seccion 1</h1>[*] [url="#"]Enlace 1[/url][*] [url="#"]Enlace 2[/url][*] [url="#"]Enlace 3[/url][*] [url="#"]Enlace 4[/url][/list]
			</div>
	<h1>Esta será la zona principal de la web</h1>
	

Este es mi segundo párrafo. Acabo de poner un punto
	 y en cambio sigue siendo un párrafo pues no le he colocado
	  aún la etiqueta de cierre. Voy a ponersela justo aquí.</p>
	<h2>Y este es el tercer párrafo</h2>

 En pocas lecciones aprenderé
	 a darle margenes para separarlos unos de otros, e incluso
	  hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.</p>
	

Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens
	 nos enseñe a ponerlos alineados a la izquierda, o justificados.
	  Así esto parece una poesia! je je je.</p>
	</div>
	<div id="pie">
		<div id="pieuno">
	 			 <ul>
				 		 [*][url="#"]Foro Ejemplo[/url][*][url="#"]Contactos[/url][*][url="#"]Nos Enlazan[/url]
				 [/list]
		</div>
		<div id="piedos"> pie dos </div>
		<div id="pietres">
  			 <ul>
    		 		 [*][url="#"]Directorio[/url][*][url="#"]TopSite[/url][*][url="#"]Mapa de la Web[/url]
 				 [/list]
		</div>
	<div id="curva-inferior"></div>
</div>
<script language="javascript" src="definir-menus.txt" type="text/javascript"></script>
<div id="estadisticas">
		 <a id="mws4527948" href="http://webstats.motigo.com/">
		 [img]http://m1.webstats.motigo.com/n.gif?id=AEUXTAyzx2E2NXwHxhxrN86ZXdbg[/img]</a>
		 <script type="text/javascript" src="http://m1.webstats.motigo.com/c.js?id=4527948"></script>
</div>
</body>
</html>

Hola:
Puede probar añadiendo en la capa contenido de la hoja de estilo (fuera de lo que tiene puesto) un width:800px
#contenido{width:800px; Después que vea como queda, le elimina donde puso 800px y solo lo deja así: #contenido{width:auto; etc.etc.etc.. puede que sea ese el problema, ya nos dirá.
Saludos