Foros del Web » Creando para Internet » HTML »

ayuda con html y menu css

Estas en el tema de ayuda con html y menu css en el foro de HTML en Foros del Web. Hola tengo mi web y la pongo con el internet explorer 8 y firefox y se ve bien, pero cuando la abro con el ie ...
  #1 (permalink)  
Antiguo 24/01/2011, 18:10
 
Fecha de Ingreso: enero-2005
Mensajes: 386
Antigüedad: 12 años, 10 meses
Puntos: 3
ayuda con html y menu css

Hola tengo mi web y la pongo con el internet explorer 8 y firefox y se ve bien, pero cuando la abro con el ie 7 y ie el menu en css no me funciona, por que? como puedo componerlo?

este es mi codigo

tambien si quito la etiqueta <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> se ve bien en explorer 6 7 y 8 pero el menu css ya no funciona en ningunpo mas que en firefox.

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<link href="estilo.css" rel="stylesheet" type="text/css" />

<link href="banners.css" rel="stylesheet" type="text/css" />

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript" src="thickbox.js"></script>

<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen"/>


<title></title>

</head>

<body>
<div id="menuprincipal">

      <ul id="menu">

      <li class="logo">

      <img style="float:left; " src="img/menu_left.png" width="59"/>

      <a  href="#">INICIO</a>

      <img class="espacio"  src="img/dot_blue.png"/>

      </li>

      <li><a href="#">PLATINUM</a>

      <ul>

        <li>

        <img class="corner_inset_left" alt="" src="img/corner_inset_left.png"/>

        <a  href="#" >POR QUE PLATINUM</a>

        <img class="corner_inset_right" alt="" src="img/corner_inset_right.png"/>

        </li>

        <li>

        <a  href="#">QUIENES SOMOS</a>

        </li>

        <li>

        <a  href="#">ANTECEDENTES</a>

        </li>

        <li class="last">

        <img class="corner_left" alt="" src="img/corner_left.png"/>

        <img class="middle" alt="" src="img/dot.png"/>

        <img class="corner_right" alt="" src="img/corner_right.png"/>

        </li>

        </ul>

      </li>

      <li><a href="#">SERVICIOS</a>

       <ul>

        <li>

        <img class="corner_inset_left" alt="" src="img/corner_inset_left.png"/>

        <a href="#">PRODUCTOS</a>

        <img class="corner_inset_right" alt="" src="img/corner_inset_right.png"/>

        </li>

        <li>

        <a href="#">CUIDADO DE EQUINE</a>

        </li>

        <li>

        <a href="#">CUIDADO DE CANINE</a>

        </li>

        <li class="last">

        <img class="corner_left" alt="" src="img/corner_left.png"/>

        <img class="middle" alt="" src="img/dot.png"/>

        <img class="corner_right" alt="" src="img/corner_right.png"/>

        </li>

        </ul>

      </li>

      <li><a href="#">UBICACION</a>

        <ul>

        <li>

        <img class="corner_inset_left" alt="" src="img/corner_inset_left.png"/>

        <a href="#">VERACRUZ</a>

        <img class="corner_inset_right" alt="" src="img/corner_inset_right.png"/>

        </li>

        <li class="last">

        <img class="corner_left" alt="" src="img/corner_left.png"/>

        <img class="middle" alt="" src="img/dot.png"/>

        <img class="corner_right" alt="" src="img/corner_right.png"/>

        </li>

        </ul>

      </li>

      <li><a href="#">CONTACTO</a></li>
      <img style="/ margin-left: 120px; / margin-top: -48px;" src="img/menu_right.png" width="26" /> 
      </ul>
    </div>
este es la de estilos
Código:
 @charset "utf-8";

/* CSS Document */

body { 

font-family:Arial, Helvetica, Sans-Serif; 

font-size:12px; 

margin:0px 0px;
background-color: #ffffff;

}

#principal {
margin 0 auto;
padding: 0px;	
}

#cabecera {
margin 0 auto;
padding: 0px;	
	}

#main {
width: 800px;
	}

#anuncio {
width: 720px;
float: left;
padding: 5px;

	}

#mininoticias {
width: 234px;
height: 274;
margin-left: 748px;
/ margin-top: -255px;

}

#imgmenu {
background: url(img/equino.png) top left no-repeat;
margin-top: 10px;
width:  257px;
height: 	174px;
margin-left: 740px;
	}
	
#imgmenu h1 span {
visibility: hidden;
}

#imgmenu h2{
margin-top: 60px;	
margin-left: 170px;
/ margin-left: 160px;
/ margin-top: 45px;	

	}



#logotipo {
background: url(img/logosjuntos.png) top left no-repeat;
float: left;
margin-top: 10px;
width: 700px;
height: 90px;
	}
	
#logotipo h1 span{
visibility: hidden;	
}

#banner {
background: url(img/banner_bottom.png) top left no-repeat;
width: 759px;
height: 	183px;

	}
	
	
#banner h1 span{
		visibility: hidden;
		}

/*  inicia menu */
#menuprincipal {
	padding: 0px;
	margin-left: 0px;
   top: 140px;
	position: absolute;
	}

#menu {

	list-style: none;

	line-height: 30px;

	margin:0;

	padding: 0;
	}

	
#menu li {

	margin:0px;

	float: left;

	

	}

	

	

#menu li a{

	display: block;

	width: 120px;

	padding:3px 0;

	text-decoration:none;

	text-align:center;

	font-size:11px;

	color:#FFFFFF;

	background-color:#333333;

}



#menu li a:hover {

	color:#ffffff;

	background-color:#c0272d;

}





#menu li ul {

	position: absolute;

	list-style: none;

	width: 10px;

	left: -999em;

}



#menu li:hover ul {

	left: auto;

}



#menu .logo {

	background:transparent none repeat scroll 0% 0%; 

	background-color:Transparent;

	}





   		

#menu .corner_inset_left { 

	position:absolute; 

	top:0px; 

	left:-12px;

	}



#menu .corner_inset_right { 

	position:absolute; 

	top:0px; 

	left:120px;

	}



#menu ul { 

	padding:0px; 

	margin:0px; 

	display:block; 

	display:inline;

	}



#menu li ul li a {

		display:block;

		color:#FFFFFF;

		}



#menu li ul li a:hover {

	color:#ffffff;
	font-weight: bold;

     }



#menu li ul li{ 

	display:block; 

	border-top: dotted 1px #606060;

	list-style-type:none; 

	}



#menu > li {

		background:#333333 none repeat scroll 0 0;

		cursor:pointer; 

		float:left; 

		position:relative;

		padding:0px 10px;
		
		}

	/* tamaño del borde azul */	



#menu .espacio {

	position:absolute;

	height: 36px;

	width: 10px;

	top:0px;

	left: 130px;
	/ 	left: 60px;  /* ie6 */

} 



#menu .last { 

   background:transparent none repeat scroll 0% 0%; 

   margin:0px; padding:0px; 

   border:none; position:relative; 

   border:none; height:0px;

   }



#menu .corner_left { 

   position:absolute; 

   left:0px; 

   top:0px;

   }



#menu .corner_right { 

   position:absolute;

   left:102px; 
   top:0px;

    }



#menu .middle { 

	position:relative; 

	left:18px; 

	height: 20px; 

	width: 90px; 

	top:0px; 

	}
	
	/* termina menu*/

Etiquetas: css
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 13:19.