Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

neotheone

menu css - problemas IE 6

Por , em Desenvolvimento frontend

Recommended Posts

neotheone    0

neotheone
Postado

Meu caros amigos,

 

Estou tendo um problema com um menu em CSS. Tal menu foi aperfeiçoado, mas estou com um pequeno problema, o dito cujo não funciona no ie 6.0 e no 7.0 funciona que é uma beleza. - LINK PARA QUEM TEM O I.E 70 menu CSS

 

Estou tendo muita dificuldade em resolver tal problema, pois não tenho muito conhecimento em Css, inclusive coloquei uns comentários para me guiar na construção do mesmo, mas realmente está complicado.

 

vou postar o código CSS e o Html mais abaixo:

 

CSS

 

/* Menu */
ul#navmenu {
	background:url(bg_menu.gif) no-repeat;
	margin:0px;
	border: 0 none;
	padding: 0;
	padding-top:7px;
	width:750px; /*For KHTML*/
	list-style: none;
	height:24px;
	/*z-index:1;
	position:relative;*/
}
/* tamanho e posição dos subs menus */
ul#navmenu ul {
	margin:0;
	padding:0;
	font:14px Arial, Helvetica, sans-serif;
	width:180px;
	list-style: none;
	display: none;
	position: absolute;
	z-index:1;
	top: 24px;
	left: 0;
}

ul#navmenu li {
	margin: 0;
	border: 0 none;
	padding: 0;
	float: left; /*For Gecko*/
	display: inline;
	list-style: none;
	position: relative;
	height: 24px;
	
}



ul#navmenu ul:after /*From IE 7 lack of compliance*/{
	clear: both;
	display: block;
	font: 1px/0px serif;
	content: ".";
	height: 0;
	visibility: hidden;
}

ul#navmenu ul li {
	background:url(ico_menu.jpg) no-repeat left;
	background-color:#01396C; /* cor de fundo - FUNDO DO SUB MENU */
	border-bottom:#086 1px solid; /* linha divisória entre uma submenu e outro */
	color:#990000;
	padding-bottom:6px;
	padding-left:8px;
	padding-top:5px;
	margin:0px;
	height:13px;
	width: 180px;
	float: left; /*For IE 7 lack of compliance*/
	display: block !important;
	display: inline; /*For IE*/
}

/* Menu principal - horizontal */
ul#navmenu a {
	padding: 0 7px;
	float: none !important; /*For Opera*/
	float: left; /*For IE*/
	display: block; 
	color: #CCFF00; /* cor da fonte do menu principal - horizontal */
	text-decoration: none; /* tipo de decoração do menu principal (pode usar underline) - horizontal */
	height: auto !important;
	height: 1%; /*For IE*/ /* mudei e nada acontece */
	font-size: 11px; /* tamanho da fonte do menu principal - horizontal */
	font-family: Verdana, Arial, Helvetica, sans-serif; /* tipo de fonte do menu principal - horizontal */
}

/* Menu principal - horizontal (quando o mouse está em cima - hover) */
ul#navmenu a:hover{
	color:#FF0000; /* cor do menu principal com o mouse em cima do link */
}


/* SUB MENUS - vertical */
ul#navmenu li:hover li a,
ul#navmenu li.iehover li a {
	color: #fff; /* cor do link normal - SUB MENUS - vertical */
	font:11px Arial, Helvetica, sans-serif; /* tamanho e fonte do link normal - SUB MENUS - vertical */
	padding-left:0px;
}

/* SUB MENUS - vertical * Com o mouse em cima */
ul#navmenu li:hover li a:hover,
ul#navmenu li:hover li:hover a,
ul#navmenu li.iehover li a:hover,
ul#navmenu li.iehover li.iehover a {
	color:#F2C103; /* cor do link do SUB MENUS - vertical * Com o mouse em cima */
	text-decoration:underline; /* decoração dos SUB MENUS - vertical * Com o mouse em cima */
}

/* 3rd Menu */
ul#navmenu li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li a {
	background: #305069;
	color: #fff;
  }

/* 3rd Menu Hover Persistence */
ul#navmenu li:hover li:hover li a:hover,
ul#navmenu li:hover li:hover li:hover a,
ul#navmenu li.iehover li.iehover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover a {
	background: #FDAF0F;
	color: #FFF;
}

/* 4th Menu */
ul#navmenu li:hover li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li.iehover li a {
	background: #EEE;
	color: #666;
}

/* 4th Menu Hover */
ul#navmenu li:hover li:hover li:hover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover li a:hover {
	background: #CCC;
	color: #FFF;
}

ul#navmenu ul ul,
ul#navmenu ul ul ul {/* Posicao to 3? nivel de menu*/
	position: absolute;
	top: 0;
	left: 210px;
}

/* Do Not Move - Must Come Before display:block for Gecko */
ul#navmenu li:hover ul ul,
ul#navmenu li:hover ul ul ul,
ul#navmenu li.iehover ul ul,
ul#navmenu li.iehover ul ul ul {
	display: none;
}

ul#navmenu li:hover ul,
ul#navmenu ul li:hover ul,
ul#navmenu ul ul li:hover ul,
ul#navmenu li.iehover ul,
ul#navmenu ul li.iehover ul,
ul#navmenu ul ul li.iehover ul {
	display: block;
}

HTML

 

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="layout.css">

</head>

<body>
<ul id="navmenu">
  <li><a href="/" title="Página Principal">Principal</a></li>
  <li><a href="#" title="Institucional">Institucional</a>
	<ul>
	  <li><a href="i_admsuperior.php">Administração Superior</a></li>
	  <li><a href="i_assessorias.php">Assessorias </a></li>
	  <li><a href="i_cpa.php">Comissão Própria de Avaliação</a></li>
	  <li><a href="i_coordenadorias.php">Coordenadorias</a></li>
	  <li><a href="i_orgtec.php">Órgãos Técnicos Administrativos</a></li>
	  <li><a href="i_campus.php">Conheça o Campus</a></li>
	  <li><a href="i_historico.php">Histórico</a></li>
	  <li><a href="i_video2007.php">Vídeos</a> </li>
	  <li><a href="i_catalogo.php">Catálogo</a></li>
	</ul>
  </li>
  <li><a href="#" title="Graduação">Graduação</a>
	<ul>
	  <li><a href="g_administracao.php">Administração</a></li>
	  <li><a href="g_arquitetura.php">Arquitetura e Urbanismo</a></li>
	  <li><a href="g_contabeis.php">Ciências Contábeis</a></li>
	  <li><a href="g_computacao.php">Ciências da Computação</a></li>
	  <li><a href="g_direito.php">Direito</a></li>
	  <li><a href="g_educacaofisica.php">Educação Física</a></li>
	  <li><a href="g_enfermagem.php">Enfermagem</a></li>
	  <li><a href="g_fisioterapia.php">Fisioterapia</a></li>
	  <li><a href="g_fonoaudiologia.php">Fonoaudiologia</a></li>
	  <li><a href="g_odontologia.php">Odontologia</a></li>
	  <li><a href="g_psicologia.php">Psicologia</a></li>
	</ul>
  </li>
  <li><a href="#" title="Pós-Graduação">Pós-Graduação</a>
	<ul>
	  <li><a href="p_especializacao.php">Especializações</a></li>
	  <li><a href="p_mba.php">MBAs</a></li>
	</ul>
  </li>
  <li><a href="pesquisa.php" title="Pesquisa">Pesquisa</a></li>
  <li><a href="#" title="Extensão">Extensão</a>
	<ul>
	  <li><a href="ext_social.php" title="Responsabilidade Social">Responsabilidade Social </a></li>
	  <li><a href="ext_cultura.php" title="Cultura">Cultura</a></li>
	</ul>
  </li>
  <li><a href="#" title="Serviços">Serviços</a>
	<ul>
	  <li><a href="http://terminal.unipe.br/quiosque/quiosque.dll" target="_blank">UNIPÊ Online</a></li>
	  <li><a href="http://webmail.unipe.br/" target="_blank">Webmail</a></li>
	  <li><a href="http://www.unipe.br/~teleduc/pagina_inicial/index.php?PHPSESSID=bbd3dc7f30d1ef6267aacdab6ec7c6dd" target="_blank">TelEduc</a></li>
	</ul>
  </li>
  <li><a href="segen.php" title="Secretaria Geral de Ensino">Segen</a></li>
  <li><a href="biblioteca.php" title="Biblioteca">Biblioteca</a></li>
  <li><a href="editora.php" title="Editora">Editora</a></li>
</ul>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Dei uma rápida olhada, mas está acontecendo que no IE6, o menu não abre neh!?

é um problema do hover nos LIs.

 

http://www.maujor.com/tutorial/ddownmenu.php

Compartilhar este post

Link para o post
Compartilhar em outros sites

programador php    0

programador php
Postado

uma dica

 

se codigo tem muita coisa, dificulta nossa legibilidade

 

monte um exemplo básico e ponha para rodar

 

e poste aqui, bem simples

 

 

abraço

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito