con explorer bien pero con mocilla....

david1975 · 25 Sep 2011, 21:19 · Solicitar retirada

Hola a todos me estoy volviendo loco porque no tengo ni idea y más vueltas que le doy no consigo saber por qué.
En el escritorio del ordenador tengo una carpeta con mis páginas web.

INTERNET EXPLORER

Pincho en la carpeta que tengo en el escritorio llamada mis páginas web, sale index.html, plantillas.html, estilos.css. y así sucesivamente funcioando todo perfectamente como cuando lo hago en el programa Kit.html.

MOCILLA Firefox.

Pincho en la carpeta que tengo en el escritorio llamada mis páginas web, sale index.html, plantillas.html, estilos.css. y así sucesivamente. pincho en index. html y funciona perfectamente el problema es cuando adcedo a la plantilla. html que desaparece la barra de navegación y las letras de la barra de contenido se suben al logotipo, también desaparece una parte del pie, lo que me confunde es que cuando adcedo al programa Kit.html funciona bien.

por favor alguna respuesta a mi problema.
muchas gracias y un saludo

Web-Freelance · 25 Sep 2011, 21:34 · Solicitar retirada

Muéstranos tu código a ver que tienes y alguna captura de como lo ves en Firefox, pero te adelanto que esos temas son complicadillos... ;-)

Saludos!

david1975 · 25 Sep 2011, 23:10 · Solicitar retirada

http://img853.imageshack.us/img853/9738/dibujohwt.jpg
esta es la imagen capturada mocilla y opera perdona si no queda bien pero soy nuevo en esto

página 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>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"><img src="objetos/logotipo7.jpg"width="798px"
height="200px"></a></div>

</div>
<div id="navegacion">
<ul>
<li><a href="SALUDA/saluda.html">SALUDA</a></li>
<li><a href="JUNTA DE GOBIERNO/juntadegobierno.html">JUNTA DE GOBIERNO</a></li>
<li><a href="historia/historia.html">HISTORIA</a></li>
<li><a href="SUGERENCIAS/sugerencias.html">SUGERENCIAS</a></li>
<li><a href="ACTIVIDADES/actividades.html">ACTIVIADES</a></li>
</ul>
</div>


<div id="contenido">





<h1>NOTICIAS</h1>
<h2>LA BORRICA CAGONA </h2>
<p>El próximo día 24 de Septiembre se celebrará el I concurso de la "borrica cagona"
en el patín del Convento en la Localidad de Luque (Córdoba) El concurso dará comienzo
a las 12:00 horas del medio día, habrá actuaciones tales como la Rondalla, baile de Sevillanas, </p></P>
<h2><img src="objetos/borrica.jpg"width="250px"
height="250px"></h2>
<p></p>

</div>



<div id="pie">
<div id="pieuno">
<ul>
<li><a href="http://www.facebook.com/profile.php?id=100002848275228#!/profile.ph…"><img src="objetos/facebook.jpg"width="25px"
height="16px" alt="facebook"></a></li><li><a href="http://www.resucitado.superforos.com">FORO</a></li><li><a href="http://www.cancionero.es/web/index.php/noticias/15-semana-santa/451…">PRENSA</a></a></li>
</ul>
</div>
<div id="piedos"><ul>
<li><a href="http://www.hermandadesdecordoba.com/home.html">HERMANDADES DE CORDOBA</a></li><li><a href="http://www.cpoyato.com/Luque/ss2005/indexSemanasanta.html">IMAGENES DE SEMANA SANTA DE LUQUE</a></li><li><a href="http://www.cancionero.es/tv/IndexIE.html">TV BAENA</a></li>
</ul></div>
<div id="pietres">
<ul>
<li><a href="#">en construcción</a></li><li><a href="#">en construcción</a></li><li><a href="#">en construcción</a></li>
</ul>
</div>
</div>



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

página estilos

david1975 · 25 Sep 2011, 23:14 · Solicitar retirada

pagina estilos

* {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
body {background-color: #000000; }
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:center }
#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: #FFF0F5 ; border-left: black 1px solid ;
border-right: black 1px solid }
#contenido p {margin: 5px 10px 0px 10px ; text-indent: 12px}
#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-parte-superior.gif) }
#pie li {list-style:none; font-size:13px;}
#pie {border-left:black 1px solid; border-right:black 1px solid;
border-top:black 1px solid; height:65px;}
#publicidad {width:798px height=200px ; font-size: 16px }
#pieuno {background-color: #363636;float:left; width:150px;}
#piedos {background-color: #363636;float:left; width:498px;}
#pietres {background-color: #363636;float:left; width:150px;}
#pie a {color: #FFFFFF; text-decoration:none ; display: block }
#pie a:link {}
#pie a:visited {}
#pie a:hover {color:#EECFA1 ; text-decoration:underline ; background-color: white }
#pie a:active {color:#EECFA1}
#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 {}

http://img821.imageshack.us/img821/1282/dibujoexplorer.jpg

así sale en el programa de kit.html

Web-Freelance · 26 Sep 2011, 09:15 · Solicitar retirada

De momento borra lo que te pongo en rojo:

<h1>NOTICIAS</h1>
<h2>LA BORRICA CAGONA </h2>
<p>El próximo día 24 de Septiembre se celebrará el I concurso de la "borrica cagona"
en el patín del Convento en la Localidad de Luque (Córdoba) El concurso dará comienzo
a las 12:00 horas del medio día, habrá actuaciones tales como la Rondalla, baile de Sevillanas, </p></P>
<h2><img src="objetos/borrica.jpg"width="250px"
height="250px"></h2>
<p></p>

Las etiquetas img terminalas con /> (con la barra), creo que tienes un par de ellas por ahí.

Luego estudio el código a ver que encuentro y te digo que ahora tengo que salir. De momento mira a ver si mejora algo con esto (no creo que mucho).

Saludos!

david1975 · 26 Sep 2011, 10:19 · Solicitar retirada

Muchas gracias por la prontitud al responder, efectivamente he realizado lo que me has dicho y no hay cambio alguno.
Un saludo

Web-Freelance · 26 Sep 2011, 11:32 · Solicitar retirada

Te he mandado un privado.

Saludos!

david1975 · 26 Sep 2011, 11:54 · Solicitar retirada

Por favor mandamelo otra vez no he recibido nada tampoco en correo no deseado,
perdona las molestias un saludo

Web-Freelance · 26 Sep 2011, 11:59 · Solicitar retirada

Enviado colega!

Web-Freelance · 26 Sep 2011, 13:17 · Solicitar retirada

Bueno aunque nos hemos hablado por privado para enviarnos algunos archivos, voy a poner aquí mas o menos los principales problemas por si a alguien le ayuda.

Basicamente nos encontramos un problema de CSS. Consejos: Intenta siempre darle un ancho a los elementos, ya sea con px o con % o con "auto" ya que si no, no está definido y algunos navegadores no lo aceptan (este era el mayor problema), no tenías definido casi ningún ancho.

Cuando quieras centrar algún contenido, no centres el elemento principal (float:center) sino que debes darle "text-align:center" (en el logotipo te pasaba esto y te lo centraba a la página, descolocándote con ello el menú.

Te he recolocado el código CSS para que sea mas legible, no lo descoloques! jeje ;-)

En general, fíjate en los cambios de tu CSS con este (ya que en el html no he tocado nada) para aplicárselas al resto de secciones.

Aquí está tu CSS modificado:

/*Generales*/

* {
	text-indent:0px ;
	margin:0px ; 
	padding:0px ; 
	border:0px
	}
	
body {
	background-color: #000000; 
	}
	
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;
	height: auto;
	margin-top: 4px;
	margin-right: auto;
	margin-bottom: 4px;
	margin-left: auto;
}

/*Curva superior*/

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

#cabecera {
	height:auto;
	float: left;
	width: 100%;
}
#logotipo {
	width:auto;
	float:left;
	text-align: center;
	height: 200px;
	padding-left: 1px;
	background-color: #000;
}

/*Menú*/

#navegacion {
	background-color: gray;
	height:20px;
	width: 798px;
	float: left;
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: black;
	border-right-color: black;
	border-bottom-color: black;
	border-left-color: black;
	margin-left: 1px;
}
#navegacion li {
	margin-right: 20px;
	margin-left: 20px;
	float: left;
	list-style-type: none;
}
#navegacion ul {
	margin-left: 60px;
}

/*Contenido*/

#contenido {
	background-color: #FFF0F5;
	border-left: black 1px solid;
	border-right: black 1px solid;
	float: left;
	height: auto;
	width: 798px;
}

#contenido p {
	margin: 5px 10px 0px 10px ; 
	text-indent: 12px
	}
	
/*Menú lateral*/

#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-parte-superior.gif) 
	}
	
/*Zona Pié de página*/

#pie li {
	list-style:none; 
	font-size:13px;
	}
#pie {
	border-left:black 1px solid; 
	border-right:black 1px solid;
    border-top:black 1px solid; height:65px;
	}
#publicidad {
	width:798px height=200px ;  
	font-size: 16px 
	}
#pieuno {
	background-color: #363636;
	float:left; width:150px;
	}
#piedos {
	background-color: #363636;
	float:left; width:498px;
	}
#pietres {
	background-color: #363636;
	float:left; width:150px;
	}
#pie a {
	color: #FFFFFF; 
	text-decoration:none ; 
	display: block 
	}
#pie a:link {}
#pie a:visited {}
#pie a:hover {
	color:#EECFA1 ; 
	text-decoration:underline ; 
	background-color: white 
	}
#pie a:active {
	color:#EECFA1
	}    
	
/*Curva inferior*/

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

a {
	color: brown ; 
	text-decoration:none ; 
	display: block 
	}
a:link {}
a:visited {}
a:hover {
	color:red ; 
	text-decoration:underline ;
	background-color: silver
	}
a:active {}

Tampoco lo he modificado de manera descomunal, solo lo necesario para que continues tu.

Y poca cosa mas, que al principio cuesta un poco, pero al final se consigue y acabas por enterarte de todo, mírame a mi que empecé igual!

Saludos!