centralizar menu dinamico com submenu,

[Kaayá Pezzuti 0]

Olá pessoal, estou com problema ao centralizar um menu dinamico com submenus

 

fiz dois exemplos

 

dessa forma a centralização fica normal

faço

ul{
position:relative;
float:left;
left:50%
overflow:none;
}
ul li{
position:relative;
right:50%
/* E A ESTILIZACAO DA LI NORMAL*/
}

EX: http://kaayapezzuti.zz.mu/textes/menu1.php

 

 

______________________________________________________________________________________

 

 

ja nesse caso funciona em partes o codigo é o mesmo só que sem o OVERFLOW:HIDDEN;

 

mas a UL fica desposicionada, vai para o lado direito e não fica bom.

EX: http://kaayapezzuti.zz.mu/textes/menu2.php

 

______________________________________________________________________________________

 

E nesse caso quando eu coloco o OVERFLOW:HIDDEN; ele corta 50% do menu na parte esquerda;

e no caso.. no meu projeto eu preciso desse OVERFLOW se for fazer desse jeito pois se não ele vaza nas laterais, e cria barra de rolagem.

 

http://kaayapezzuti.zz.mu/textes/menu3.php

 

 

existe alguma outra forma de manter o menu dinamico com submenu centralizado mesmo quando o numero de menus vai aumentar?

caso seja 10 menus com submenu ou 3 ele continue centralizado?

pois esse problema surge quando coloco o submenu

 

espero que possam me ajudar..

Abraços

[Nosreve 12]

Usando apenas CSS, da pra fazer usando display: inline-block

mas se não me engano os IE antigos, não aceitam, os novos ja aceitam

 

caso você não se preocupe com IEs antigos, basta você fazer isso,

retire os positions, floats, e left e right 50%, e substitua apenas por isso

 

ul{
  width: 100%;
  text-align: center;
}
ul li{
  max-width: 120px;
  margin-left: 10px;
  margin-right: 10px;
  display: inline-block;
}

Caso isso não te seja util, da pra fazer com Jquery

[Kaayá Pezzuti 0]

Usando apenas CSS, da pra fazer usando display: inline-block

mas se não me engano os IE antigos, não aceitam, os novos ja aceitam

 

caso você não se preocupe com IEs antigos, basta você fazer isso,

retire os positions, floats, e left e right 50%, e substitua apenas por isso

 

ul{
  width: 100%;
  text-align: center;
}
ul li{
  max-width: 120px;
  margin-left: 10px;
  margin-right: 10px;
  display: inline-block;
}

Caso isso não te seja util, da pra fazer com Jquery

 

haahah deu certinha, esse funcionou,

até qual IE aceita esse procedimento? vou projetar o site para até ie7, mas também estou fazendo media queryes,

o css do IE7 vou usar comentario condicional com html.

[Nosreve 12]

Usar condicional é uma boa, sempre vai ter uma coisinha pra ajeitar no IE,

 

mas se não me engano a partir do 8 ja aceita o inline-block,

faz o seguinte, tem um programa muito bom que serve para testar os sites em todas as versões do IE

 

o nome é IETester

http://www.baixaki.com.br/download/ietester.htm

 

testa la, e vai arrumando ate ficar bom em todos os IEs

[Kaayá Pezzuti 0]

Usar condicional é uma boa, sempre vai ter uma coisinha pra ajeitar no IE,

 

mas se não me engano a partir do 8 ja aceita o inline-block,

faz o seguinte, tem um programa muito bom que serve para testar os sites em todas as versões do IE

 

o nome é IETester

http://www.baixaki.com.br/download/ietester.htm

 

testa la, e vai arrumando ate ficar bom em todos os IEs

hahahah

valew... vou ver se uso ele...

 

vai se de grandeeee ajuda esse programa...

Abraço