Problema con firefox

Buen gente, seguí el curso de html kit y entre a modificar cosas para hacer mi propia web. Al hacer esto me salio lo que quería pero el problema es que con Internet Explorer se me ve bien salvo por un problema de ancho q es lo de menos. (aunque si me peuden decir porque pasa y como arreglarlo mejor aun :P ) Lo que pasa es que se ve mas ancho de lo q deveria verse


Pero el verdadero problema es con firefox ( y no probe con opera u otros) que cuando la abro con firefox me ignora totalmente la hoja de estilos y no se porque

http://lista9.mywebcommunity.org/

esta es la pagina intenten entrar y van a ver q me ignora totalmente la hoja de estilos en el firefox y sin embargo con IE me la abre de lo mas bien salvo porque se ve muy ancha a pesar de que crei haber especificado que tuviera un ancho de 800 px

* {margin:0px ; padding:0px ; border: 0px ;}
body {text-align: center; background-image:url(objetos/fondo.png); background-position: center center }
h1 {font-size: 1.5em; color:white ; font-weight: bold ; text-decoration: underline ; text-align: center ;float:right ; margin: 20px 70px 0px 0px ;}
h2 {font-size: 0.9em; color:black; font-weight: bold ; text-decoration: none ; text-align: center}
#cabecera {width:700px ; background-position: bottom ; height:150px ; background-image: url(objetos/cabecera.png) }
#navegacion { background-color: black ;border-bottom: #DCDCDC 1px solid ;border-top: 0px; border-left: #DCDCDC 1px solid ; border-right: #DCDCDC 1px solid ;height:20px;width:700px ; }
#contenido {height:400px; background-color: black ;; border-left: #DCDCDC 1px solid ; border-bottom: #DCDCDC 1px solid ; border-right: #DCDCDC 1px solid ; width:700px}
#pie {background-color: black; border-left: #DCDCDC 1px solid ; border-right: #DCDCDC 1px solid ; height:65px ; width:700px }
#contacto {text-aling: center}
#intermedio {background-color:#100033 ; height:10px ; border: #DCDCDC 1px solid ; width:700px}
#menu { width: 150px ; float:left ; text-align:left ; margin:3px 10px 3px 3pxx ; background-image: url(objetos/menu1.png); background-position: bottom ; padding-bottom:5px }
#menu li {list-style:none ; margin: 4px 0px 4px 6px}
#menu h1 { text-decoration:none ; font-size:12px ; margin: 0px 0px 0px 0px;
background-image: url(objetos/menu2.png);padding-top:12px ; width:150px }
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px ; width:700px ; color: #DCDCDC ;font-size: 1.2em ; }
#contenido h2 {margin-bottom:5px;font-family:bell mt ;text-align:Center ; color:#9400D3 ; ; font-size: 1.1em ; text-decoration: none}
#curva-inferior { background-image: url(objetos/curva-inferior.png) ; background-color:black ;
background-repeat: no-repeat ;
width:700px ;
height: 12; overflow : hidden }
#logotipo {background-color: white ; width:280px ; float: left; margin-top:25px}
#publicidad {background-color: white ; width:518px ; float: left ; margin-bottom:25px ; margin-top: 20px}
#navegacion li {float:left ; margin: 0px 30px 0px 30px ; list-style:none ; }
#navegacion ul { margin-left: 130px ; float:left; margin-left:5px }
a {color: blue ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color:#F5F5F5 ; text-decoration:underline ; background-color: none}
a:active {}
p { width:700px ;}
#pie li {list-style: none }
#pieuno { float:left ; width:150px ; font-size: 10 }
#piedos { float:left ;width:498px }
#pietres { float:left ; width:150px ; font-size: 10 }
#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 {}
a.enlaceuno {}
a.enlaceuno:link {}
a.enlaceuno:visited {}
a.enlaceuno:hover {}
a.enlaceuno:active {}
#navegacion a {color: #D3D3D3 ; text-decoration:none ; display: block}
#navegacion a:link {}
#navegacion a:visited {}
#navegacion a:hover {color:#D3D3D3 ; text-decoration:underline ; background-color: white}
#navegacion a:active {color:#B22222}

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

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<title>Esqueleto de la pagina de la 9</title>
</head>
<body>
<div id="global">

<div id="cabecera"> </div>
<div id="navegacion">
<ul>

Inicio

Historia

Multimedia

Descargas

Contacto

Canciones

</div>
<div id="intermedio"></div>
<div id="contenido"><div id="menu"><ul><h1>Título de Sección 1</h1>

Enlace 1

Enlace 2

Enlace 3

Enlace 4
</div>
<h1>Bienvenidos a la pagina oficial de la Lista 9</h1></div>
<div id="pie">
<div id="pieuno">

Directorio

TopSite

Mapa de la Web</div>
<div id="piedos">pie dos</div>
<div id="pietres">

Directorio

TopSite

Mapa de la Web</div></div>
<div id="curva-inferior"></div>
</div>
</body>
</html>

No me funciona la URL :?

Jugoncan escribió:No me funciona la URL :?

a claro muy navo lo mio la baje del domino xD

ahora la subo denuevo

ok :D

Jugoncan escribió:ok :D

listo ya la subi

si la abris con Ie se ve relativamente bien salvo el problemade el ancho
q se deve solucionar facil

y si abris con firefox
es un asco xD

Pues creo que ya lo arreglaste

porque yo lo veo bien con firefox

salvo eso del ancho

que al checar los codigos, veo que en el html tienes definido
una div global

pero en la hoja de estilos, no la veo por ningun lado
recuerda que debes acomodar las cosas /(en css) segun su orden de aparicion en html

de arriba hacia abajo



saludos

Yaneth escribió:Pues creo que ya lo arreglaste

porque yo lo veo bien con firefox

salvo eso del ancho

que al checar los codigos, veo que en el html tienes definido
una div global

pero en la hoja de estilos, no la veo por ningun lado
recuerda que debes acomodar las cosas /(en css) segun su orden de aparicion en html

de arriba hacia abajo

lo ves bien? O.o

yo lo abro y veo por un lado la pagina y ala derecha el fondo :S y todas las letras de color qno deveria ser y cosas por el estilo osea no veo nada de lo q se definio en la hoja de estilos


saludos

Hola

pues si...... no se a que te refieres con que firefox no te reconoce la hoja de estilos

yo lo veo practicamente igual en los dos navegadroes (colores, letras, fondos etc.)

lo unico es que en firefox la página está recargada a la izq, y en iexplorer está centrada

pero eso se debe a lo que te comenté que te falta definir la global en css

saludos

Yaneth escribió:Hola

pues si...... no se a que te refieres con que firefox no te reconoce la hoja de estilos

yo lo veo practicamente igual en los dos navegadroes (colores, letras, fondos etc.)

lo unico es que en firefox la página está recargada a la izq, y en iexplorer está centrada

pero eso se debe a lo que te comenté que te falta definir la global en css

saludos

y eso lo soluciono sacandola o definiendole cosas en css porq sinceramente no se que definirle en el css y no se si servira sacar la division global


mira t dejo la hoja de estilos y la hoja del index con los cambios que le hice

basicamente ordene las cosas en el .css y sake de el index la division global. pero se sigue viendo mal :S

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

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<title>Lista 9 Conduccion Cecap</title>
</head>
<body>
<div id="cabecera"> </div>
<div id="navegacion">
<ul>

Inicio

Historia

Multimedia

Descargas

Contacto

Canciones

</div>
<div id="intermedio"></div>
<div id="contenido">
<font face="comic sans MS, new york, times" size=+1><h1>Noticias</h1></font></div>
<div id="pie">
<div id="pieuno"></div>
<div id="piedos">pie dos</div>
<div id="pietres"></div></div>
<div id="curva-inferior"></div>
</body>
</html>

* {margin:0px ; padding:0px ; border: 0px ;}
body {text-align: center; background-image:url(objetos/fondo.png); background-position: center center }
h1 {font-size: 1.5em; color:white ; font-weight: bold ; text-decoration: underline ; text-align: center ;float:right ; margin: 20px 70px 0px 0px ;}
h2 {font-size: 0.9em; color:black; font-weight: bold ; text-decoration: none ; text-align: center}
a.enlaceuno {}
a.enlaceuno:link {}
a.enlaceuno:visited {}
a.enlaceuno:hover {}
a.enlaceuno:active {}
a {color: blue ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color:#F5F5F5 ; text-decoration:underline ; background-color: none}
a:active {}
p {width:700px ;}
#cabecera {width:700px ; background-position: bottom ; height:150px ; background-image: url(objetos/cabecera.png) }
#logotipo {background-color: white ; width:280px ; float: left; margin-top:25px}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color: white }
#logotipo a:active {}
#navegacion { background-color: black ;border-bottom: #DCDCDC 1px solid ;border-top: 0px; border-left: #DCDCDC 1px solid ; border-right: #DCDCDC 1px solid ;height:20px;width:700px ; }
#navegacion li {float:left ; margin: 0px 30px 0px 30px ; list-style:none ; }
#navegacion ul { margin-left: 130px ; float:left; margin-left:5px }
#navegacion a {color: #D3D3D3 ; text-decoration:none ; display: block}
#navegacion a:link {}
#navegacion a:visited {}
#navegacion a:hover {color:#D3D3D3 ; text-decoration:underline ; background-color: white}
#navegacion a:active {color:#B22222}
#intermedio {background-color:#100033 ; height:10px ; border: #DCDCDC 1px solid ; width:700px}
#contenido {height:400px; background-color: black ;; border-left: #DCDCDC 1px solid ; border-bottom: #DCDCDC 1px solid ; border-right: #DCDCDC 1px solid ; width:700px} #contacto {text-aling: center}
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px ; width:700px ; color: #DCDCDC ;font-size: 1.2em ; }
#contenido h2 {margin-bottom:5px;font-family:bell mt ;text-align:Center ; color:#9400D3 ; ; font-size: 1.1em ; text-decoration: none}
#menu { width: 150px ; float:left ; text-align:left ; margin:3px 10px 3px 3pxx ; background-image: url(objetos/menu1.png); background-position: bottom ; padding-bottom:5px }
#menu li {list-style:none ; margin: 4px 0px 4px 6px}
#menu h1 { text-decoration:none ; font-size:12px ; margin: 0px 0px 0px 0px;background-image: url(objetos/menu2.png);padding-top:12px ; width:150px }
#publicidad {background-color: white ; width:518px ; float: left ; margin-bottom:25px ; margin-top: 20px}
#pie {background-color: black; border-left: #DCDCDC 1px solid ; border-right: #DCDCDC 1px solid ; height:65px ; width:700px }
#pie li {list-style: none }
#pieuno { float:left ; width:150px ; font-size: 10 }
#piedos { float:left ;width:498px }
#pietres { float:left ; width:150px ; font-size: 10 }
#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}
#curva-inferior { background-image: url(objetos/curva-inferior.png) ; background-color:black ;background-repeat: no-repeat ;width:700px ; height: 12; overflow : hidden }

Hola

lo que deberías haber hecho es
dejar el global en el index

pero te faltaba definirlo en el css asi:

#global {width:800px ; margin:4px auto;}

recuerda ponerlo en la parte de arriba (del css) justo despues de body

saludos

A mi tambien me pasa, mi pagina la abro con firefox y se ve fatal, da asco, me gustaria ssaver por que y como lo podria solucionar

se sigue viendo medio mal ahora lo que pasa es q sobresale 1px del contenido la barra de navegacion y el pie de pagina y el fondo se ve mal y tanto arriva como abajo me deja un espacio

buenas gente arregle un par de cosas pero se sigue viendo muy mal mis codigos quedaron asi pero tengo 2 problemas tanto en innet como en firefox se ve el cuerpo a al izquierda y el body a la derecha y por otro lado en firefox se ve un pixel q sobresale en toda la pàrte q esta en negro en innet no.

dejo los codigos, solo le puse width al body saque nuevamente el global

* {margin:0px ; padding:0px ; border: 0px ;}
body {width:1000px ; background-image:url(objetos/fondo.png); background-repeat:no-repeat ; background-position:center center}
h1 {font-size: 1.5em; color:white ; font-weight: bold ; text-decoration: underline ; text-align: center ;float:right ; margin: 20px 70px 0px 0px ;}
h2 {font-size: 0.9em; color:black; font-weight: bold ; text-decoration: none ; text-align: center}
a.enlaceuno {}
a.enlaceuno:link {}
a.enlaceuno:visited {}
a.enlaceuno:hover {}
a.enlaceuno:active {}
a {color: blue ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color:#F5F5F5 ; text-decoration:underline ; background-color: none}
a:active {}
p {width:700px ;}
#cabecera {width:700px ; background-position: bottom ; height:150px ; background-image: url(objetos/cabecera.png) }
#logotipo {background-color: white ; width:280px ; float: left; margin-top:25px}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color: white }
#logotipo a:active {}
#navegacion { background-color: black ;border-bottom: #DCDCDC 1px solid ;border-top: 0px; border-left: #DCDCDC 1px solid ; border-right: #DCDCDC 1px solid ;height:20px;width:700px ; }
#navegacion li {float:left ; margin: 0px 30px 0px 30px ; list-style:none ; }
#navegacion ul { margin-left: 130px ; float:left; margin-left:5px }
#navegacion a {color: #D3D3D3 ; text-decoration:none ; display: block}
#navegacion a:link {}
#navegacion a:visited {}
#navegacion a:hover {color:#D3D3D3 ; text-decoration:underline ; background-color: white}
#navegacion a:active {color:#B22222}
#intermedio {background-color:#100033 ; height:10px ; border: #DCDCDC 1px solid ; width:700px}
#contenido {height:400px; background-color: black ;; border-left: #DCDCDC 1px solid ; border-bottom: #DCDCDC 1px solid ; border-right: #DCDCDC 1px solid ; width:700px} #contacto {text-aling: center}
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px ; width:700px ; color: #DCDCDC ;font-size: 1.2em ; }
#contenido h2 {margin-bottom:5px;font-family:bell mt ;text-align:Center ; color:#9400D3 ; ; font-size: 1.1em ; text-decoration: none}
#menu { width: 150px ; float:left ; text-align:left ; margin:3px 10px 3px 3pxx ; background-image: url(objetos/menu1.png); background-position: bottom ; padding-bottom:5px }
#menu li {list-style:none ; margin: 4px 0px 4px 6px}
#menu h1 { text-decoration:none ; font-size:12px ; margin: 0px 0px 0px 0px;background-image: url(objetos/menu2.png);padding-top:12px ; width:150px }
#publicidad {background-color: white ; width:518px ; float: left ; margin-bottom:25px ; margin-top: 20px}
#pie {background-color: black; border-left: #DCDCDC 1px solid ; border-right: #DCDCDC 1px solid ; height:65px ; width:700px }
#pie li {list-style: none }
#pieuno { float:left ; width:150px ; font-size: 10 }
#piedos { float:left ;width:498px }
#pietres { float:left ; width:150px ; font-size: 10 }
#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}
#curva-inferior { background-image: url(objetos/curva-inferior.png) ; background-color:black ;background-repeat: no-repeat ;width:701px ; height: 12; overflow : hidden }

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

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<title>Lista 9 Conduccion Cecap</title>
</head>
<body>

<div id="cabecera"> </div>
<div id="navegacion">
<ul>

Inicio

Historia

Multimedia

Descargas

Contacto

Canciones

</div>
<div id="intermedio"></div>
<div id="contenido">
<font face="comic sans MS, new york, times" size=+1><h1>Noticias</h1></font></div>
<div id="pie">
<div id="pieuno"></div>
<div id="piedos">pie dos</div>
<div id="pietres"></div></div>
<div id="curva-inferior"></div>

</body>
</html>

Tienes un problema con el ancho de los tres pies
no caben dentro de pie

y agregale un float:left

a la curva inferior

saludos