mi web no va bien con firefox

tengo un problema con mi web y es que en internet esplorer la veo tal como kiero verla pero en firefox no logro verla como yo lo deseo

bueno apenas la estoy construyendo y estoy en la barra de navegacion y es ahy donde esta el problema.

en el internet explorer se ve bien cuando doy click en el enlace pero en firefox no.
bueno aki les dejo el codigo de mi pagina y de la hoja de estilos css

<html>
<head>
<title>Mi Primera Plantilla Desde Cero - Diego Farias</title>
<link rel="stylesheet" href="estilos.css" media="all" type="text/css">
</head>
<body>

<div id="global">

<div id="cabecera">
<div id="imagen-cabecera"></div>
<div id="navegacion">
<ul class="nav">
<li class="nav">[url="#"]enlace1[/url]
<li class="nav">[url="#"]enlace2[/url]
<li class="nav">[url="#"]enlace3[/url]
<li class="nav">[url="#"]enlace4[/url]
<li class="nav">[url="#"]enlace5[/url]
<li class="nav">[url="#"]enlace6[/url]
</div>

</div>

</body>
</html>
/*archivo de estilos css*/

BODY {background-color: red ; text-align: center}

#global {MARGIN: 0px auto; WIDTH: 800px ; background-color: pink ; height: 250px}
#cabecera {height: 200px; width: 800px ; background-color: black}
#imagen-cabecera {background-image: url(objetos/cabecera.jpg); overflow: hidden ; width: 800 ;height: 150px}
#navegacion {background-image: url(objetos/fondo-navegacion.jpg); background-repeat: repeat-y ; width: 796; height: 50px; border: 2px solid #000 }
ul.nav {text-align:center; margin-left: 40px; margin-top: 5px }
ul li.nav {float: left;list-style: none ; width: 110px}
ul li a.nav {height:30px; width: 115px; text-decoration:none; font: 1.1em comic sans ms; color: black; background-image: url(objetos/boton.gif); overflow: visible; background-repeat: no-repeat}
ul li a:active.nav {background-image: url(objetos/boton-activo.gif); text-decoration: none}

asi es como se ve en firefox
[contenido no disponible]
asi cuando doy click en el link
[contenido no disponible]

asi es como se ve en el explorer
[contenido no disponible]
y asi se ve en el IE cuando doy click en los enlaces
[contenido no disponible]

muchas gracias por su ayuda
prueba a dejar asi el html

<html>
<head>
<title>Mi Primera Plantilla Desde Cero - Diego Farias</title>
<link rel="stylesheet" href="estilos.css" media="all" type="text/css">
</head>
<body>

<div id="global">

<div id="cabecera">
<div id="imagen-cabecera"></div>
<div id="navegacion">
<ul>
<li class="nav">enlace1
<li class="nav">enlace2
<li class="nav">enlace3
<li class="nav">enlace4
<li class="nav">enlace5
<li class="nav">enlace6

</div>

</div>

</body>
</html>
En la hoja de estilos aumentale mas el margen lo puse en 44 si es eso y ves que mejora ... pero no es lo que quieres aumentale más ... y con respecto a la HTML ... agregale el


/*archivo de estilos css*/

BODY {background-color: red ; text-align: center}

#global {MARGIN: 0px auto; WIDTH: 800px ; background-color: pink ; height: 250px}
#cabecera {height: 200px; width: 800px ; background-color: black}
#imagen-cabecera {background-image: url(objetos/cabecera.jpg); overflow: hidden ; width: 800 ;height: 150px}
#navegacion {background-image: url(objetos/fondo-navegacion.jpg); background-repeat: repeat-y ; width: 796; height: 50px; border: 2px solid #000 }
ul.nav {text-align:center; margin-left: 44px; margin-top: 5px }
ul li.nav {float: left;list-style: none ; width: 110px}
ul li a.nav {height:30px; width: 115px; text-decoration:none; font: 1.1em comic sans ms; color: black; background-image: url(objetos/boton.gif); overflow: visible; background-repeat: no-repeat}
ul li a:active.nav {background-image: url(objetos/boton-activo.gif); text-decoration: none}
d.....
nekako escribió:tengo un problema con mi web y es que en internet esplorer la veo tal como kiero verla pero en firefox no logro verla como yo lo deseo

bueno apenas la estoy construyendo y estoy en la barra de navegacion y es ahy donde esta el problema.

en el internet explorer se ve bien cuando doy click en el enlace pero en firefox no.
bueno aki les dejo el codigo de mi pagina y de la hoja de estilos css

<html>
<head>
<title>Mi Primera Plantilla Desde Cero - Diego Farias</title>
<link rel="stylesheet" href="estilos.css" media="all" type="text/css">
</head>
<body>

<div id="global">

<div id="cabecera">
<div id="imagen-cabecera"></div>
<div id="navegacion">
<ul class="nav">
<li class="nav">[url="#"]enlace1[/url]
<li class="nav">[url="#"]enlace2[/url]
<li class="nav">[url="#"]enlace3[/url]
<li class="nav">[url="#"]enlace4[/url]
<li class="nav">[url="#"]enlace5[/url]
<li class="nav">[url="#"]enlace6[/url]
</div>

</div>

</body>
</html>
/*archivo de estilos css*/

BODY {background-color: red ; text-align: center}

#global {MARGIN: 0px auto; WIDTH: 800px ; background-color: pink ; height: 250px}
#cabecera {height: 200px; width: 800px ; background-color: black}
#imagen-cabecera {background-image: url(objetos/cabecera.jpg); overflow: hidden ; width: 800 ;height: 150px}
#navegacion {background-image: url(objetos/fondo-navegacion.jpg); background-repeat: repeat-y ; width: 796; height: 50px; border: 2px solid #000 }
ul.nav {text-align:center; margin-left: 40px; margin-top: 5px }
ul li.nav {float: left;list-style: none ; width: 110px}
ul li a.nav {height:30px; width: 115px; text-decoration:none; font: 1.1em comic sans ms; color: black; background-image: url(objetos/boton.gif); overflow: visible; background-repeat: no-repeat}
ul li a:active.nav {background-image: url(objetos/boton-activo.gif); text-decoration: none}
Hola:
Me he liado un poco (es que no encuentro las gafas), pero parece ser que usted tiene cuatro capas en su página. "global" que es en la que están metidas todas las demás, así que dentro de global tiene la capa cabecera, y dentro de esa capa cabecera tiene una capa con una imagen, y después usted tiene la capa navegación, por lo que veo, usted todas las capas que ha abierto las ha cerrado correctamente, pero la capa global no la ha cerrado, debiera de poner un </div> allí abajo donde tiene los otros dos cierres.
Con respecto a la hoja de estilos, creo que usted le ha dado una altura fija a la capa global de 250px entonces si la cabecera de altura tiene 200, significa que le sobran 50px, asi que en la capa navegación usted le ha dado una altura de 50px , en teoría todo muy bien, pero recuerde que a la capa navegación le ha puesto un borde de 2px por arriba y un borde de 2px por abajo así que eso hipoteticamente sumaría 54px, asi que 54px mas 200 de la cabecera suman 254px, pero la capa global solo tiene 250px. por tanto pienso que habría que agregarle algo mas de pixeles a la capa global, y recuerde cerrar la capa global en la httml.
Saludos