Ir para conteúdo

POWERED BY:

Arquivado

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

The G@ambiarriator

menu aparece no ie e não aparece no ff

Recommended Posts

bom dia galera.

eu so meio que novato em css, e achei um menu bem legal na internet num site com artigos/tutoriais.

eu apenas copiei ele para entender e alterar, mas quando vou testar no firefox (pc) ou no safari (mac) ele não aparece o fundo do menu, que é uma imagem de background...

 

eu achei o menu aqui: http://www.cssplay.co.uk/menus/final_drop.html

 

e a única alteração técnica que eu fiz foi colocar um background-image no primeiro nivel do menu.

 

 

html:

<div class="menu">

<ul>

<li><a href="studio.php">Studio</a></li>

<li><a href="eventos.php">Eventos

<!--[if IE 7]><!--></a><!--<![endif]-->

<!--[if lte IE 6]><table><tr><td><![endif]-->

<ul style="top: 17px;">

<li><a href="foto.php">Foto</a></li>

<li><a href="video.php">Vídeo</a></li>

</ul>

<!--[if lte IE 6]></td></tr></table></a><![endif]-->

</li>

<li><a href="servicos.php">Serviços

<!--[if IE 7]><!--></a><!--<![endif]-->

<!--[if lte IE 6]><table><tr><td><![endif]-->

<ul style="top: 17px;">

<li><a href="fotos_publicitarias.php">Fotos Publicitárias</a></li>

<li><a href="servicos_digitais.php">Serviços Digitais</a></li>

<li><a href="servicos_especiais.php">Serviços Especiais

<!--[if IE 7]><!--></a><!--<![endif]-->

<!--[if lte IE 6]><table><tr><td><![endif]-->

<ul>

<li><a href="encadernacao.php">Encadernação</a></li>

<li><a href="laminacao.php">Laminação</a></li>

<li><a href="impressao_gf.php">Impressão e Grande Formato</a></li>

<li><a href="molduras.php">Molduras</a></li>

</ul>

<!--[if lte IE 6]></td></tr></table></a><![endif]-->

</li>

</ul>

<!--[if lte IE 6]></td></tr></table></a><![endif]-->

</li>

<li><a href="produtos.php">Produtos

<!--[if IE 7]><!--></a><!--<![endif]-->

<!--[if lte IE 6]><table><tr><td><![endif]-->

<ul style="top: 17px;">

<li><a href="loja_virtual.php">Loja Virtual</a></li>

<li><a href="promocoes.php">Promoções</a></li>

</ul>

<!--[if lte IE 6]></td></tr></table></a><![endif]-->

</li>

</ul>

</div>

 

 

css:

.menu {

width: 778px;

font-size: 0.80em;

font-size: 12px;

font-family: arial;

position: relative;

z-index: 100;

margin-top: 135px;

_margin-top: -3px;

background-image: url('imagens/barra.jpg');

}

 

.menu ul {

padding: 0;

margin: 0;

list-style-type: none;

float: right;

}

 

.menu ul ul {

width: 150px;

}

 

.menu li {

float: left;

width: 150px;

position: relative;

}

 

.menu a, .menu a:visited {

display: block;

font-size: 11px;

text-decoration: none;

color: #fff;

width: 139px;

height: 18px;

/*border: 1px solid #fff;

border-width: 1px 1px 0 0;

background: #758279;*/

padding-left: 11px;

line-height: 15px;

}

 

* html .menu a, * html .menu a:visited {

width: 150px;

w\idth: 139px;

}

 

.menu ul ul a.drop, .menu ul ul a.drop:visited {

/*background: #d4d8bd url(../../graphics/drop.gif) bottom right no-repeat;*/

background-image: url('imagens/barra.jpg');

}

 

.menu ul ul a.drop:hover{

background-image: url('imagens/barra.jpg');

}

 

.menu ul ul :hover > a.drop {

background-image: url('imagens/barra.jpg');

}

 

 

.menu ul ul ul a, .menu ul ul ul a:visited {

font-size: 9px;

}

 

 

.menu ul ul ul a:hover {

background-color: #cccccc;

}

 

 

.menu ul ul {

visibility: hidden;

position: absolute;

height: 0;

top: 31px;

left: 0;

width: 150px;

}

 

 

* html .menu ul ul {

top: 30px;

t\op: 31px;

}

 

.menu ul ul ul{

left: 147px;

top: 0;

width: 150px;

}

 

.menu ul ul ul.left {

left: -150px;

}

 

.menu table {

position: absolute;

top: 0;

left: 0;

}

 

.menu ul ul a, .menu ul ul a:visited {

background-color: #999999;

color: #ffffff;

height: auto;

line-height: 1em;

padding: 5px 10px;

width: 129px;

}

 

* html .menu ul ul a{

width: 150px;

w\idth: 129px;

}

 

 

.menu a:hover, .menu ul ul a:hover{

color: #ffffff;

background: #999999 url('imagens/barra.jpg');

}

 

.menu :hover > a, .menu ul ul :hover > a {

color: #ffffff;

background: #999999;

}

 

.menu ul :hover ul{

visibility: visible;

}

 

.menu ul :hover ul ul{

visibility: hidden;

}

 

.menu ul :hover ul :hover ul{

visibility: visible;

}

 

agradeço ajudas!

abraço!

Compartilhar este post


Link para o post
Compartilhar em outros sites

The G@ambiarriator, tabém seja muitobem vindo ao iMasters!!! http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

 

Em relação a sua dúvida, primeiro verifique se o endereço está correto!

Verifique se fazendo isso aqui:

 

background-image: url(../imagens/barra.jpg);
Ele não vai funcionar, ok?

 

[]´s

Compartilhar este post


Link para o post
Compartilhar em outros sites

você pelo menos tentou fazer isso q falei pra ver se resolvia?E se você tiver um link com esse menu, passa ai pra gente ver como tá ficando sua página!

Compartilhar este post


Link para o post
Compartilhar em outros sites

pqp... q codigo mais horrivel... gambiarra purinha...tenta retirar as aspas simples do background... talvez funcione...

Compartilhar este post


Link para o post
Compartilhar em outros sites

gio, obrigado pela ajuda, mas eu sabia que não funcionaria...só tentei porque voce pediu, e mesmo assim não deu certo...

 

pa_bruno, por que o código é gambiarra pura? eu peguei aqui nesse site: http://www.cssplay.co.uk/

tinha tutorial e tudo mais.

 

porque voce não aproveita e me explica do porque meu código ser gambiarra? desculpe se não nasci sabendo como você...

Compartilhar este post


Link para o post
Compartilhar em outros sites

falae rapaz... primeiramente, eu sei q o codigo veio do css play, eu jah tinha visto... naum falei q você nasceu sabendo, MUITO MENOS q eu nasci sabendo, longe disso...desnecessária essa sua "agressão", mas tah relax, tem problema naum... meu comentário naum foi pra t "agredir" nem nada naum... desculpe d qq forma, mas a internet naum nos deixa enfatizar, realmente, o q falamos... ops, escrevemos... =DDDDcara, eh gambiarra, pq eh cheio dos comentarios condicionais para o internet explorer, abrindo tabelas, tr e tds e tudo mais... gambiarra purinha para fazer com q funcione no internet explorer... fora a utilização dos styles nas tags...por ae vai... ;)

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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