Problema com divs+css no I6

[falke 0]

olah!!!

estou com um problema no IE6....estou com a div menu (em azul claro) com a UL e a LI (azul escuro), ao passar o mouse ela fica como esta na imagem, ateh ai, no mozilla, ok sem problemas...porém no IE6 a LI não ultrapassa o limite inferior da div menu e nem de sua UL...

 

imagem do menu feito no mozilla, perfeito:

 

o dito menu

 

como posso resolver isso da forma mais pratica...pensei em fazer outra div abaixo da menu com as LI's que farão o papel da parte inferior das LI's de cima..mas aí vai dar um trabalhao....

 

se alguém tiver alguma dica ou sugestao, agradeço

[Paulo de Tarso F. M. 24]

Não tem nenhum link pra gente ver os problemas?

[falke 0]

segue o cogigo:

 

<div id="menu">			<ul>			  <li style="border:1px solid red" id="l1"><a href="index.php" title="PÁGINA PRINCIPAL" tabindex="1">home</a></li>			</ul>			</div>

css:

div#menu{	margin-top:-15px!important;	margin-top:-2px;	width:770px;	height:30px!important;	background-color:#7CB1CA;	padding-top:0px;	padding-bottom:0px;	border:1px solid red;	}div#menu UL{	height:20px;	padding-left:0px;	margin-left:0px;	padding-top:7px;	margin-bottom:10px!important;	margin-bottom:0px;	border:1px solid red;}div#menu UL LI{	list-style:none;	display:inline;	text-transform:lowercase;	font-weight:600;	padding-top:7px;	margin:0px;		border-left:#006699 1px solid;	border-right:#006699 1px solid;}div#menu UL LI A{	padding-left:30px;	padding-right:30px;	margin:0px;		color:#FFFFFF;}div#menu UL LI A:HOVER{	padding-top:7px;	padding-bottom:10px;	text-decoration:none;	background-color:#006699;	margin:0px;}

[Paulo de Tarso F. M. 24]

Olha... Não tô conseguindo abrir sua imagem agora e por causa disso não posso tentar encontrar uma solução para você... Mas já adianto que seu CSS tem muita coisa desnecessária... Tenta dar uma "enxugada" nele e também ver porque a imagem não está abrindo...

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[falke 0]

Olha... Não tô conseguindo abrir sua imagem agora e por causa disso não posso tentar encontrar uma solução para você... Mas já adianto que seu CSS tem muita coisa desnecessária... Tenta dar uma "enxugada" nele e também ver porque a imagem não está abrindo... http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

a imagem jah esta aparecendo.tipo o q você diz que dah pra tirar??? tem mta coisa q coloquei justamente pra tentar arrumar... :-)

[Paulo de Tarso F. M. 24]

Bom, consegui acessar a imagem agora... Mas mesmo assim continuo sem entender muito bem o que você precisa... A imagem é o resultado final que deve aparecer? Mas é que está muito confuso... E aquelas linhas todas lá? Pra que exatamente? Porque, dependendo do local onde você vai usar isso, se aquelas linhas vermelhas estão ali para um efeito visual, não é bem mais fácil fazer com uso de uma imagem de fundo?

 

Bom, de qualquer forma, testarei depois no meu FF2 em casa pra comparar com o IE6... E quanto ao desnecessário no CSS, acho que até exagerei dizendo "muita coisa"... Na verdade, são alguns itens, mas que eu preciso testar antes de te dizer exatamente quais são para não dizer besteira... http://forum.imasters.com.br/public/style_emoticons/default/assobiando.gif Ok? Depois vou analisar melhor seu "caso"... À tarde...

 

Abraço!

[Paulo de Tarso F. M. 24]

Olha... Testei nos dois browsers e realmente há diferença... Mas é o seguinte: que raio de menu é esse? Meow, tá muito confuso! Eu até agora não consegui associar a idéia... E quanto ao CSS, por exemplo:

div#menu{

margin-top:-15px!important;

margin-top:-2px;

width:770px;

height:30px!important;

background-color:#7CB1CA;

padding-top:0px;

padding-bottom:0px;

padding: 0;

border:1px solid red;

}

1 - Se você declarou o !important, não há a necessidade de se manter a linha debaixo...

2 - Se você não tem nenhuma medida especificada para os paddings left e right, não precisa declarar padding-top e padding-bottom separadamente... Coloque tudo em uma única declaração padding: 0; (Obs.: quando se tem um valor nulo [zero] não há a necessidade de se especificar a unidade de medida... Por isso, coloque somente o zero)...

 

Mas a e... Tenta melhorar isso a e! Tá difícil compreender onde quer chegar... http://forum.imasters.com.br/public/style_emoticons/default/closedeyes.gif

[falke 0]

Olha... Testei nos dois browsers e realmente há diferença... Mas é o seguinte: que raio de menu é esse? Meow, tá muito confuso! Eu até agora não consegui associar a idéia... E quanto ao CSS, por exemplo:

div#menu{

margin-top:-15px!important;

margin-top:-2px;

width:770px;

height:30px!important;

background-color:#7CB1CA;

padding-top:0px;

padding-bottom:0px;

padding: 0;

border:1px solid red;

}

1 - Se você declarou o !important, não há a necessidade de se manter a linha debaixo...

2 - Se você não tem nenhuma medida especificada para os paddings left e right, não precisa declarar padding-top e padding-bottom separadamente... Coloque tudo em uma única declaração padding: 0; (Obs.: quando se tem um valor nulo [zero] não há a necessidade de se especificar a unidade de medida... Por isso, coloque somente o zero)...

 

Mas a e... Tenta melhorar isso a e! Tá difícil compreender onde quer chegar... http://forum.imasters.com.br/public/style_emoticons/default/closedeyes.gif

 

olah Paulo, vleu pela atenção!!! vleu pelas sugestoes...akela borda vermelha eu coloquei pra visualizar o q estava ocorrendo..heeheh..foi malze não avisar!!!!

acho q dei uma melhorada na imagem...veja ae:

 

nova imagem

 

sera q a unica soluçao seria inserir uma imagem (mesma cor do fundo da div) de background sem repetiçao, com altura menor q a LI???

[RoXbY 3]

isso que eu ia falar...faz uma de 1px de largura.... não irá influenciar em nada o carregamento do site por se tratar de um valor insignificante, mesmo se junto com o resto do layout cara...eu acredito que sim, mesmo por que.... utilize o display table na div azul clara para que fique certinho e não de problema no resto da página...abraços!