error al hacer y deshacer cambios que no puedo solucionar

**tapeinosis** · 03/09/2010, 16:32

he estado haciendo cambios en el index de la web que estoy preparando siguiendo el curso
he intentado poner imágenes y modificar estilos de algunos títulos
como no me gustaba como quedaba he querido volver a como lo tenía al comenzar a trabajar y veo que se me han cambiado los párrafos en color y tamaño y el pie se ha separado del contenido y se han agrandado y puesto en negrita el menú de navegación y el menú lateral de contenidos

estoy repasando el código del index y la hoja de estilos y no consigo ver dónde está el fallo para solucionarlo
al hacer cambios y deshacerlos he debido borrar o modificar algo que no descubro, es como si el párrafo hubiera tomado la forma de h2...

os pongo en respuestas siguiente tanto el código de index como el de la hoja de estilos

gracias por anticipado

**tapeinosis** · 03/09/2010, 16:33

CODIGO FUENTE DEL INDEX
------------------------------------------

<!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>para escritores de Iconos</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

</head>

<body>

<div id="global">

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

<div id="cabecera">
<div id="logotipo">
<a href="index.html">
[img]objetos/logotipo1.jpg[/img]
</a>
</div>
<div id="publicidad">
<h1>"a cada cual se le otorga la manifestación del Espíritu para provecho común"</h1>
<h2>(1ª Co 12, 7)<h2>
<h2>----</h2>

</p>
<h2>Bienvenidos a esta web católica dedicada a los escritores de Iconos</h2>
</div>
</div>

<div id="navegacion">
<ul>[*]Inicio[*]Iconografía[*]el Iconógrafo[*]Galería de Iconos[*]Lecturas del domingo[*]Iglesia y vida diaria[/list] </div>

<div id="contenido">

<div id="menu">
<h1>Inicio</h1>
<ul>[*]Inicio[*]últimas actualizaciones[*]¿tapeinosis?[*]¿quiénes somos?[*]Enlaces[/list] </div>

</p>
<h3> "DUODECIMUN - SAECULUM" </h3>

</p>
<h2>Carta Apostólica del Papa Juan Pablo II (1987)</h2>

</p>

nº 11. Desde hace algunos decenios se observa un renovado interés por la teología y la espiritualidad de los iconos orientales, señal de una creciente necesidad del lenguaje espiritual del arte auténticamente cristiano. A este propósito invito a mis hermanos en el Episcopado a "que observen diligentemente lo que ha establecido el Concilio: mantener firmemente la práctica de proponer en las iglesias las imágenes sagradas a la veneración de los fieles" y a esforzarse para que cada vez surjan más obras de calidad verdaderamente eclesial.</p>
<div id="imagen1">[img]objetos/virgen1.jpg[/img]</div>

Los fieles cristianos de hoy, como los de ayer, han de ser ayudados en la oración y en la vida espiritual con la visión de obras que intentan expresar el misterio sin ocultar nada. Esta es la razón por la que, hoy como en el pasado, la fe es el necesario estímulo del arte eclesial. El arte por el arte que hace referencia sólo a su autor, sin establecer una relación con lo divino, no tiene cabida en la concepción cristiana. Cualquiera que sea el estilo que adopte, todo arte sacro debe expresar la fe y la esperanza de la Iglesia. La tradición de la imagen sagrada indica que el artista debe tener conciencia de cumplir una misión al servicio de la Iglesia.</p>

El auténtico arte cristiano es aquel que, a través de la percepción sensible, permite intuir que el Señor está presente en su Iglesia, que los acontecimientos de la historia de la salvación dan sentido y orientación a nuestra vida, que la gloria que se nos ha prometido transforma ya nuestra existencia. El arte sacro debe tender a darnos una síntesis visual de todas las dimensiones de nuestra fe. El arte de la Iglesia debe procurar hablar la "lengua" de la Encarnación y, expresar, con los elementos de la materia, a Aquel que "se ha dignado habitar en la materia y llevar a cabo nuestra salvación a través de la materia", según la bella fórmula de San Juan Damasceno.</p>

<div id="imagen2"> [img]objetos/cristo1.jpg[/img]</div>

El redescubrimiento de la imagen cristiana ayudará también a tomar conciencia de la urgencia de reaccionar contra los efectos despersonalizadores y, a veces, degradantes de esas múltiples imágenes que, a través de la publicidad y de los medios de comunicación social, condicionan nuestra vida. El icono cristiano pone sobre nosotros la mirada del Autor invisible, y nos da acceso a la realidad del mundo espiritual y escatológico.</p>

nº 12. (...) Nuestra más auténtica tradición, que compartimos plenamente con nuestros hermanos ortodoxos, ciertamente nos enseña que el lenguaje de la belleza, puesto al servicio de la fe, puede tocar el corazón de los hombres y hacerles conocer, interiormente, a Aquel que nosotros nos atrevemos a representar en imágenes, Jesucristo, Hijo de Dios hecho hombre, "el mismo, ayer y hoy, y por todos los siglos".</p>

</p>

</div>

<div id="pie">
<div id="pieuno">
<ul>
[*]Buzón[*]Contactos[*]Nos Enlazan[/list] </div>
<div id="piedos">últimas actualizaciones</div>
<div id="pietres">
<ul>[*]Directorio[*]TopSite[*]Mapa de la Web[/list] </div>
</div>

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

</div>

</body>

</html>

**tapeinosis** · 03/09/2010, 16:35

HOJA ESTILO GENERAL
-------------------

* {text-indent:0px ; margin:0px ; padding:0px ; border: 0px}
p {text-align: justify; margin: 6px 6px 6px 6px}
#imagen1 {float:left ; margin: 10px 10px 10px 10px}
#imagen2 {float:right ; margin: 10px 10px 10px 10px}
h1 {font-size: 1.2em; color:brown ; font-weight: bold ; text-decoration: none ; text-align: center}
h2 {font-size: 1.1em; color:brown ; font-weight: bold ; text-decoration: none ; text-align: center}
h3 {font-size: 25px; color:brown ; font-weight: bold ; text-decoration: underline ; text-align: center}
body {text-align: center ; background-image: url(objetos/fondo.gif) ; background-position: center ; background-repeat ; height:100%; }
#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:125px}
#logotipo {width:90px ; float:left ; margin: 6px 0px 6px 6px}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color: white }
#logotipo a:active {}
.cita {text-align:right}
#publicidad {background-color: white ; width:702px ; float:right; margin-top: 25px}
#navegacion {background-color: orange ; border: black 1px solid ; height:20px}
#navegacion ul {margin-left: 20px }
#navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px}
#contenido {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid}
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 20px}
#menu {background-color: #DAA520; width: 150px ; float:right ; text-align:left ; margin:5px 15px 5px 5px ; 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}
a {color: black ; text-decoration: none ; display: block}
a:link {}
a:visited {}
a:hover {color: DarkGreen ; text-decoration: underline ; background-color: #D2B48C}
a:active {}
#pie {border-left: black 1px solid ; border-right: black 1px solid ; border-top: black 1px solid ; height: 65px ; background-color: white}
#pie li {list-style: none ; font-size: 12px}
#pieuno {float:left ; width:150px ; background-color: white}
#piedos {float:left ; width:498px ; background-color: orange}
#pietres {float:left ; width:150px ; background-color: white}
#pie a {color: brown; text-decoration:none ; display: block}
#pie a:link {}
#pie a:visited {}
#pie a:hover {color:Red ; text-decoration:underline ; background-color: Peru}
#pie a:active {color:DarkBlue}
#curva-inferior {background-image: url(objetos/curva-inferior.gif) ; background-repeat: no-repeat ; width:800px ; height: 12px ; overflow: hidden}

**tapeinosis** · 03/09/2010, 22:12

zocorrooooooo ayuda que no sé cómo arreglarlo

**manmanu** · 04/09/2010, 13:56

Hola, bueno....
Hay pequeños problemillas que hacen que no lo veas como pienso que lo deberias tener, pues no conozco los pasos hacia adelante y atrás que hiciste.
Pero con mi editor, veo algunos problemas cmúnes.
<h2>(1ª Co 12, 7)<h2> esto te genera errores, pero nada tiene que ver con lo de tu pie.(Debes cerrar h2)
[*]Enlaces[/list] Esto también te genera errores.(Te sobra un )

Pero lo que realmente te separa el pie, y el menú de navegación es este código en tus estilos.
p {text-align: justify; margin: 6px 6px 6px 6px} Aqúí dices a todos los parrafos que tengan ese margen lo cuál a tí, como lo tienes no te veneficia.
Creo que deberías eliminarlo si no te afecta a otras hojas o contenido.
Como solucinamos el margen, para que no se acerque el texto, u otros elementos a los costados...???
Muy sencillo, hacemos padding al interior de todo lo que está dentro del contenido, así...
#contenido {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid;padding:6px 10px}
Tú tenías 6px 6px 6px 6px, yo te puse 6px 10px, lo puede poner como quieras el padding interior.

Estos son lo errores más notorios.
Espero lo soluciones.
No se como lo tenías anteriormente, pero los errores que te preocupan pudiera ser que con este consejo se corrijan.
Suerte.......
manmanu

**tapeinosis** · 04/09/2010, 17:16

graciaaaaassssss
se ha solucionado casi todooooo
¡muchísmas gracias!

lo único que pasa ahora es en el pie, que sale más estrecho
el cambio que hice en el pie es el color de centro...
te pongo el código

**tapeinosis** · 04/09/2010, 17:16

CÓDIGO FUENTE
-----------------------------

<!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>para escritores de Iconos</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

</head>

<body>

<div id="global">

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

<div id="cabecera">
<div id="logotipo">
<a href="index.html">
[img]objetos/logotipo1.jpg[/img]
</a>
</div>
<div id="publicidad">
<h1>"a cada cual se le otorga la manifestación del Espíritu para provecho común"</h1>
<h2>(1ª Co 12, 7)</h2>
<h2>----</h2>

</p>
<h2>Bienvenidos a esta web católica dedicada a los escritores de Iconos</h2>
</div>
</div>

<div id="navegacion">
<ul>[*]Inicio[*]Iconografía[*]el Iconógrafo[*]Galería de Iconos[*]Lecturas del domingo[*]Iglesia y vida diaria[/list] </div>

<div id="contenido">

<div id="menu">
<h1>Inicio</h1>
<ul>[*]Inicio[*]últimas actualizaciones[*]¿tapeinosis?[*]¿quiénes somos?[*]Enlaces[/list] </div>

</p>
<h3> "DUODECIMUN - SAECULUM" </h3>

</p>
<h2>Carta Apostólica del Papa Juan Pablo II (1987)</h2>

</p>

nº 11. Desde hace algunos decenios se observa un renovado interés por la teología y la espiritualidad de los iconos orientales, señal de una creciente necesidad del lenguaje espiritual del arte auténticamente cristiano. A este propósito invito a mis hermanos en el Episcopado a "que observen diligentemente lo que ha establecido el Concilio: mantener firmemente la práctica de proponer en las iglesias las imágenes sagradas a la veneración de los fieles" y a esforzarse para que cada vez surjan más obras de calidad verdaderamente eclesial.</p>
<div id="imagen1">[img]objetos/virgen1.jpg[/img]</div>

Los fieles cristianos de hoy, como los de ayer, han de ser ayudados en la oración y en la vida espiritual con la visión de obras que intentan expresar el misterio sin ocultar nada. Esta es la razón por la que, hoy como en el pasado, la fe es el necesario estímulo del arte eclesial. El arte por el arte que hace referencia sólo a su autor, sin establecer una relación con lo divino, no tiene cabida en la concepción cristiana. Cualquiera que sea el estilo que adopte, todo arte sacro debe expresar la fe y la esperanza de la Iglesia. La tradición de la imagen sagrada indica que el artista debe tener conciencia de cumplir una misión al servicio de la Iglesia.</p>

El auténtico arte cristiano es aquel que, a través de la percepción sensible, permite intuir que el Señor está presente en su Iglesia, que los acontecimientos de la historia de la salvación dan sentido y orientación a nuestra vida, que la gloria que se nos ha prometido transforma ya nuestra existencia. El arte sacro debe tender a darnos una síntesis visual de todas las dimensiones de nuestra fe. El arte de la Iglesia debe procurar hablar la "lengua" de la Encarnación y, expresar, con los elementos de la materia, a Aquel que "se ha dignado habitar en la materia y llevar a cabo nuestra salvación a través de la materia", según la bella fórmula de San Juan Damasceno.</p>

<div id="imagen2"> [img]objetos/cristo1.jpg[/img]</div>

El redescubrimiento de la imagen cristiana ayudará también a tomar conciencia de la urgencia de reaccionar contra los efectos despersonalizadores y, a veces, degradantes de esas múltiples imágenes que, a través de la publicidad y de los medios de comunicación social, condicionan nuestra vida. El icono cristiano pone sobre nosotros la mirada del Autor invisible, y nos da acceso a la realidad del mundo espiritual y escatológico.</p>

nº 12. (...) Nuestra más auténtica tradición, que compartimos plenamente con nuestros hermanos ortodoxos, ciertamente nos enseña que el lenguaje de la belleza, puesto al servicio de la fe, puede tocar el corazón de los hombres y hacerles conocer, interiormente, a Aquel que nosotros nos atrevemos a representar en imágenes, Jesucristo, Hijo de Dios hecho hombre, "el mismo, ayer y hoy, y por todos los siglos".</p>

</p>

</div>

<div id="pie">
<div id="pieuno">
<ul>
[*]Buzón[*]Contactos[*]Nos Enlazan[/list] </div>
<div id="piedos">últimas actualizaciones</div>
<div id="pietres">
<ul>[*]Directorio[*]TopSite[*]Mapa de la Web[/list] </div>
</div>

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

</div>

</body>

</html>

**tapeinosis** · 04/09/2010, 17:17

HOJA ESTILOS
------------------------

* {text-indent:0px ; margin:0px ; padding:0px ; border: 0px}
p {text-align: justify}
#imagen1 {float:left ; margin: 10px 10px 10px 10px}
#imagen2 {float:right ; margin: 10px 10px 10px 10px}
h1 {font-size: 1.2em; color:brown ; font-weight: bold ; text-decoration: none ; text-align: center}
h2 {font-size: 1.1em; color:brown ; font-weight: bold ; text-decoration: none ; text-align: center}
h3 {font-size: 25px; color:brown ; font-weight: bold ; text-decoration: underline ; text-align: center}
body {text-align: center ; background-image: url(objetos/fondo.gif) ; background-position: center ; background-repeat ; height:100%; }
#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:125px}
#logotipo {width:90px ; float:left ; margin: 6px 0px 6px 6px}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color: white }
#logotipo a:active {}
.cita {text-align:right}
#publicidad {background-color: white ; width:702px ; float:right; margin-top: 25px}
#navegacion {background-color: orange ; border: black 1px solid ; height:20px}
#navegacion ul {margin-left: 20px }
#navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px}
#contenido {background-color: white ; border-left: black 1px solid ; border-right: black 1px solid; padding 6px 10px}
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 20px}
#menu {background-color: #DAA520; width: 150px ; float:right ; text-align:left ; margin:5px 15px 5px 5px ; 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}
a {color: black ; text-decoration: none ; display: block}
a:link {}
a:visited {}
a:hover {color: DarkGreen ; text-decoration: underline ; background-color: #D2B48C}
a:active {}
#pie {border-left: black 1px solid ; border-right: black 1px solid ; border-top: black 1px solid ; height: 65px ; background-color: white}
#pie li {list-style: none ; font-size: 12px}
#pieuno {float:left ; width:150px ; background-color: white}
#piedos {float:left ; width:498px ; background-color: orange}
#pietres {float:left ; width:150px ; background-color: white}
#pie a {color: brown; text-decoration:none ; display: block}
#pie a:link {}
#pie a:visited {}
#pie a:hover {color:Red ; text-decoration:underline ; background-color: Peru}
#pie a:active {color:DarkBlue}
#curva-inferior {background-image: url(objetos/curva-inferior.gif) ; background-repeat: no-repeat ; width:800px ; height: 12px ; overflow: hidden}