Problema en diferentes navegadores

CifuSO · #1 (**permalink**) 14/03/2005, 14:22

Hola gente; estoy acá para ver si algun guru me puede sacar del paso. Mi problema es que estoy desarrollando una aplicacion puramente en css y se me presento un problema bastante particular, pero aun comun.. jeje
Es que un menu (menu_izq.html) en Iexplorer y en Opera se ve como quiero, pero el problema esta en Mozilla Firefox. Mi objetivo es que se vea "usable" en estos tres navegadores. Ahora el problema:
Este es el menu y como se ve en cada navegador (deberia verse el "Nueva Cuenta" como se ve en IE y Opera, pero nose que puede estar pasando):

Ahora va el codigo del css:

Código:

#menu1{
	background-image:url(menu1.jpg);
    width: 100%;
	height: auto;
}

/* bloques de menu izquierdo*/


#head1{
	float: left;
	background-image:url(header1.jpg);
	width: 100%;
	height: 55px;
}


 #header{
	font:12px Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-style:normal;
	font-weight:700; 
	margin-top: 15px;
    padding-left: 25px;
    /*background:url(../images/iconos/edit_top.gif) left no-repeat;*/
}

#menu_content {
width: 80%;
margin-left: 1em;
height:auto;
}


li{
list-style-type: none;
margin-top: 10px;
margin-left: 10px;
padding-left: 10px;
/*background:url(../images/iconos/edit_top.gif) left no-repeat;*/
}


li a:link {
font:13px Arial, Helvetica, sans-serif;
color:#003366;
text-decoration: none;
}


li a:visited {
font:13px Arial, Helvetica, sans-serif;
color:#000033;
text-decoration: none;
}

li a:hover {
color:#000033;
font: 12px Arial, Helvetica, sans-serif;
font-weight:700;
}
#menu_pie{
  
	background-image:url(pie_menu.jpg);
    background-repeat:no-repeat;
	width: 100%;
	height: 40px;

}
#master_menu {
   position:absolute;
   top: 80px;
   left:0px; 
   width: 176px;   
   height:auto;
   }

Ahora el codigo del html:

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento sin t&iacute;tulo</title>
<link rel="stylesheet" href="menu_iz.css" type="text/css" />
</head>

<body>
<div id="master_menu">
	        
			<div id="head1"> 
		       <ul id="header">WebMail</ul> 
	        </div>
       
	        <div id="menu1">
			    
				<div id="menu_content">
				  <li> <a href="#">Nueva cuenta</a> </li>
				  <li> <a href="#">Configurar</a> </li>
		          <li> <a href="#">Asignature</a> </li>
				</div> 
           
		    </div>
			
         <div id="menu_pie"></div>
	 </div>
</body>
</html>

Pueden ver la pagina en accion aqui , y les sugiero que la visiten en IExplorer/Opera y luego en Mozilla para qe vean el cambio y a ver si me pueden ayudar.

Muchas gracias por anticipado..!!

kemie · #2 (**permalink**) 14/03/2005, 14:58

hm, tu problema es que te has olvidado de meter tus lis dentro de una lista <ul>!

podrias reestructurarlo de esta manera:
<div id="menu1">

<ul id="menu_content">
<li> <a href="#">Nueva cuenta</a> </li>
<li> <a href="#">Configurar</a> </li>
<li> <a href="#">Asignature</a> </li>
</ul>

</div>

CifuSO · #3 (**permalink**) 14/03/2005, 15:09

Entiendo lo que dices kermie, pero todo sigue igual

posavasos · #4 (**permalink**) 14/03/2005, 21:46

#menu_content { clear:both; }

Remo:Erdosain · #5 (**permalink**) 15/03/2005, 02:59

Me parece o te está faltando además un li {text-align:center} ?

CifuSO · #6 (**permalink**) 15/03/2005, 07:39

Espectacular Posavasos..!!! Remo:Erdosain, a eso lo solucione con un Text-indent y solucionado el caso.
La ultima; me podrias decir Posavasos como funciona en concreto el Clear-both? Tengo una nocion basica nomas, pero me gustaria que me la explayes.

Gracias..!!!!

Remo:Erdosain · #7 (**permalink**) 15/03/2005, 07:48

Hace poco comentabamos del tema en Acerca de clear:both

<sarcasmo>Que mal, haciendole publicidad a la competencia</sarcasmo>

CifuSO · #8 (**permalink**) 15/03/2005, 08:07

Muy bueno el articulo del Clear:both, pero... como funcionó en el caso concreto de mi aplicacion?? digamos, que hizo que dejara de flotar a su lado?? El "Nueva Cuenta" ???? Si es así lo entendí...
Gracias..!!

Remo:Erdosain · #9 (**permalink**) 15/03/2005, 14:01

Al aplicarle clear:both a "nueva cuenta" prohibiste contenido flotante a los costados. "Nueva cuenta" se terminó ubicando DEBAJO del contenido flotante

CifuSO · #10 (**permalink**) 16/03/2005, 14:50

Barbaro..!!

Gracias a todos..!!!