Ir para conteúdo

POWERED BY:

Arquivado

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

A. G. Doimo

Menu com múltiplas cores e diferentes bg.

Recommended Posts

Caros colegas, estou tendo problemas na criação de um menu com diferentes cores: o primeiro item deveria ter a cor da fonte azul na condição a:link e a:visited e um azul claro na condição a:hover, o segundo item deveria ter a cor verde e e verde claro com o a:hover e assim sucessivamente. O background-image deveria alterar-se tbm com a condição a:hover, segue o código css que escrevi até agora.

html</div>	<div id="master_content_left">	  	  <div id="menu_left">	    <ul>		<li class="como"><a class="como" href="como.htm">Como?</a></li>		<li class="onde"><a href="onde.htm">Onde?</a></li>		<li class="porque"><a href="porque.htm">Porque Fazer?</a></li>		<li class="parceiros"><a href="parceiros.thm">Parceiros</a></li>	  	</ul>	  </div>        </div>

e o código CSS

#master_content_left {	background-image: url(../images/content_page_left.jpg);	background-repeat: no-repeat;	background-position: left top;	float: left;	height: auto;	width: 200px;	position:relative;	clear:both;	margin: 0px;	padding: 0px;}#menu_left {	width: 180px;	height: auto;	margin-top: 220px;	margin-right: 0px;	margin-bottom: 0px;	margin-left: 0px;	padding: 0px;	float: right;	}#menu_left ul {	margin:0;	text-align:right;	display:block;	text-decoration:none;	list-style-type: none;}#menu_left ul li {	background-image: url(../images/flip_menu_off.jpg);	background-repeat: no-repeat;	font-family: Geneva, Arial, Helvetica, sans-serif;	font-size: 12px;	padding-right: 15px;	padding-top: 14px;	padding-left: 0;	padding-bottom: 18px;	text-decoration:none;}.como a:link, a:visited {	color: #0071FF;	background-repeat: no-repeat;	background-position: right top;}.como a:hover, a:active {	color:#2ECFD6;	background-image:url(../images/flip_menu_on.jpg);	background-repeat:no-repeat;	background-position: right top;}.onde a:link, a:visited {	color:#75A27E;}.onde a:hover, a:active {	color:#00A224;	background-image:url(../images/flip_menu_on.jpg);	background-repeat:no-repeat;	background-position: right top;}.porque a:link, a:visited {	color:#A1322D;}.porque a:hover, a:active {	color:#FF4E48;	background-image:url(../images/flip_menu_on.jpg);	background-repeat:no-repeat;	background-position: right top;}.parceiros a:link, a:visited {	color:#B79C00;}.parceiros a:hover, a:active {	color:#EBC801;	background-image:url(../images/flip_menu_on.jpg);	background-repeat:no-repeat;	background-position: right top;}

agradeço desde já quem puder me ajudar com esse problema.Abs,Xtremac

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá,Testei seu código no Firefox e a mim pareceu-me tudo na perfeição, menos as tais imagens porque não as tenho no respectivo directorio.Cumps \o/

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá,Testei seu código no Firefox e a mim pareceu-me tudo na perfeição, menos as tais imagens porque não as tenho no respectivo directorio.Cumps \o/

O problema continua, parece que ele perde especificidade, no Safari, Shira, prá Mac está ok, para FFox e Opera prá MAC a cor do último link repete no item ONDE ou seja, o item fica dourado.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá,Aqui no meu Windows parece-me tudo ok.Cumps \o/

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.