Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa noite,
Fiz um menu usando <ul> e <li>, vertical (além de um horizontal) para um layout. Assustadoramente, tudo no IE está perfeito, porém, no Firefox, o menu da esquerda, que deveria ser vertical, se atropela, fica uma bagunça... alguém tem idéia do motivo?
Aqui está o layout:
Aqui o CSS:
/ CSS Document /body { margin-top: 0px; margin-bottom: 0px; text-align: center; / hack pro IE /}p { margin-top: 0px; margin-bottom: 2px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #000000; text-align: left;}#geral { width: 750px; margin: 0 auto; border-right: 1px groove #B2BCA3; border-left: 1px groove #B2BCA3; text-align: left; /hack pro IE/}#menutopo { text-align: center; width: 750px; background-color:#B2BCA3;}#menutopo ul { padding:0px; margin:0px; width: 750px; background-color:#B2BCA3; list-style: none; text-align: center;}#menutopo ul li { display: inline;}#menutopo ul li a { padding: 2px 12px; float:left; background-color:#B2BCA3; text-decoration: none; border-bottom:none; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; border-right: 1px solid #006600; border-lef: 1px solid #006600; color: #000000;}#menutopo ul li a:hover { background-color:#006600; font-color: #000000; color: #000000;}#topo { clear: both;; margin-top: 0px; margin-left: 0px; border: 0px; background-color:#B2BCA3;}.imagemdotopo{ margin-top: 0px; margin-left: 0px;}#esquerda { width:150px; float: left; margin-top: 0px;}#esquerda ul { padding:0px; margin-left: 2px; margin-bottom: 0px; margin-top: 0px; margin-right: 0px; background-color:#FFFFFF; list-style: none; text-align: left;}#esquerda ul li a { padding: 0px; margin-left: 2px; float:left; background-color:#FFFFFF; text-decoration: none; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; color: #006600;}#esquerda ul li a:hover { background-color:#FFFFFF; font-color: #006600; color: #000000;}.titulodosmenus { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; font-color: #006600; text-decoration: none; background-color: #B2BCA3; color: #006600; text-align: center;}#direita { width:150px; float: right;}.fundosdodireito { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; font-color: #006600; text-decoration: none; background-color: #DDE1D7; color: #006600; text-align: center; margin-bottom: 5px;}.fundoparceiros { background-color: #000000; align: center; text-align: center;}.botoesparceiros-capa { text-align: center; border: 0px; margin-top: 2px; margin-bottom: 0px; margin-left: 27px;}#conteudo { width: 442px; margin-left: 151px;}h1 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; text-decoration: none; background-color: #006600; margin-top: 0px; margin-bottom: 0px;}.destaque-imagem { align: left; margin-top: 0px; margin-left: 0px; margin-right: 5px; margin-bottom: 3px; float: left;}#rodape { widht: 750px; clear: both; background-color:#B2BCA3; text-align: center; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #000000;}
Agradeço desde já ^_^
Eva, adicione isso na <li> do seu menu vertical, veja se funciona:
display: block;width: tamanhopx;Caso não funcione, por favor, volte a postar!
[]´s http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Olá,
Eu testei colocar, no css, tanto
#esquerda ul li {display: list-item;}
quanto
#esquerda ul li {display: block;width: tamanhopx;}
E continua dando o mesmo problema! Não sei mais o que fazer, já que metade dos visitantes do site em questão usam o FF, então é impensável deixar esse browser de lado!
Eva, veja se o link ajuda você: http://www.maujor.com/tutorial/cssmenu.php
[]'s http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
>
Eva, veja se o link ajuda você: http://www.maujor.com/tutorial/cssmenu.php
[]'s http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Então eu devo estabelecer um id pra ul em questão? Foi isso que você quis dizer?É que olhando assim, por cima, parece estar tudo certinho, no IE funciona e tudo.
Declarado uma id pra UL eu consegui fazer dar certo, valeu mesmo!
dando uma olhada rápida não vi nada de anormal =/tenta colocar isso#esquerda ul li {display: list-item;}soh uma dica ali você seta a mesma font-color e outras regras em elementos filhoslogo você poderia utilizar inherit =D