Alterar um menu para exibir em colunas.

Amigo, eu tenho um menu desse no meu projeto de intranet. É claro que não é só isso que está lá, mas eu achei que você já tinha aplicado as regras nele. Vamos lá.

Primeiro. Você deverá define um widht fixa para sua div e deixa a height como auto, para ela ir crescendo junto ao menu. blz?

Segunda: Você deverá também estabelecer o tamanho para suas li, pois se não ela seguirar a sua linha logica, mesmo definindo com float left, ele no caso vai estororar de itens. Pense por exemplo divide sua div em duas então cada li tera que ter quase que metade dessa div.

Veja só meu exemplo aqui:


Quando vc passar o mouse sobre o item do menu principal desse essa lista.

Ah sim, edyonil.

Mas então, eu encontrei na própria interface do joomla onde dá pra fazer isso (aparentemente).

lá em Menus/Main Menu
Aí a gente escolhe uma opção do menu e vai em "Parameters (Extended)".
Lá tem a opção de quantas colunas quer usar <!-- s:lol: --><img src="{SMILIES_PATH}/icon_lol.gif" alt="" title="Rindo" /><!-- s:lol: -->

Eu coloquei 3 lá e agora, quando passo o mouse no menu, aparecem 3 colunas.

O problema é que elas estão aparecendo uma embaixo da outra. <!-- s:| --><img src="{SMILIES_PATH}/icon_neutral.gif" alt="" title="Neutro" /><!-- s:| -->

O fundo do menu até ficou largo, onde as colunas deveriam ficar. Mas elas estão uma embaixo da outra. Algo está errado, mas é ali que se define isso.

Você ou alguém mais já fez isso antes e sabe como resolver? Muitíssimo obrigado!!!

Lamento... nunca fiz assim. A forma que faço é essa que cito acima.

Abraços

Só definir a largura e altura de uma div e o tamanho da li e colocar o float como left não resolve o problema. É claro que os itens do menu vão continuar decendo e nunca vão se dividir em colunas.

O que eu queria saber é se há uma real possibilidade de fazer isso utilizando apenas CSS. Eu sei fazer várias coisas em CSS e sempre aprendo mais quando surge uma necessidade nova. Isso nunca fiz, por isso não sabia se tinha como.

Mas como eu vi que existe uma configuração pronta no Joomla pra dividir o item de menu em colunas, é bem mais prático do que criar uma classes e alterar o fonte manualmente.

Eu fui no item de menu e em "Parameters (Extended)" e coloquei para exibir em 3 colunas. Ele exibe, mas uma embaixo da outra. Só o fundo é que ficou largo como se as colunas estivessem uma ao lado da outra (que é o que deveria acontecer).
Se alguém souber o que pode estar acontecendo, por favor, me dê uma ajuda.

Se houver como modificar isso somente pelo CSS (o que eu acho difícil), sem mexer na programação, também gostaria de saber.

Muito obrigado!

degoninja escreveu: Só definir a largura e altura de uma div e o tamanho da li e colocar o float como left não resolve o problema. É claro que os itens do menu vão continuar decendo e nunca vão se dividir em colunas.

Amigo me perdoe, mas comigo deu certo, o código que usei para fazer o menu em colunas foi esse:

Lamento não está acontecendo com seu código, mas tenho certeza que funciona pois tenho a prova no projeto da intranet que trabalho. Tive que fazer o menu com colunas e eu não tinha a mínima idéia que podia fazer isso usando os parâmetros do maimmenu.