Problemas com Span

[Desbravador 0]

E ai pessoal beleza?

Num entendo muito bem de CSS, mais peguei um exemplo q tá problemático e gostaria de acerta,

para estar utilizando,

é o seguinte estou tentando fazer aparecer o resultado do span acima do background

 

esse é o codigo.html

<li id="RodIcon01" title="Incluir Pedidos">
           <a name="LnkRodBar" href="pedidos/incluir_pedido.php" target="centro">
                         <span>Incluir Pedidos</span>
           </a>
</li>

 

este é o css.

#Rodape #RodBar #RodIcon01{ background: url(../img/rodape/bt_incluirPedido.png) no-repeat 4px 7px;}

até aqui td certo porém quando vai executar o hover

#Rodape #RodBar li a:hover span{
	position: relative;
	height: 40px;
	width: 	45px;
	background:#FFF;
	display: block;
	filter:alpha(opacity=30);
	opacity:0.30;
}

dá erro porque mostra o conteudo da span dentro do background:#FFF;

e gostaria que aparecesse em cima alguém sabe como faço isso?

Desde já agradeóc a atenção de todos.

[William Bruno 1501]

O background, sempre fica por baixo, e no teu caso, está por baixo do conteudo do span..

 

Acho que o teu problema, é que o conteudo do span, está ficando transparente juntamente com a cor do bg, por causa dos filtros que você usou... e você não deve querer isso...

Para ajeitar, posicione outro bloco com o conteudo por cima do fundo.

[Desbravador 0]

Valeu pela resposta,

porém talvez eu não tenha me expressado bem,

Quero q no quadro principal apareça a opacidade,

e acima dessa opacidade o texto do span,

quando digo acima estou dizendo, como se o texto estivesse uma linha acima.

valeu,

espero ter me explicado melhor.

[inforsis 1]

dá erro porque mostra o conteudo da span dentro do background:#FFF;

e gostaria que aparecesse em cima alguém sabe como faço isso?

Quero q no quadro principal apareça a opacidade,

e acima dessa opacidade o texto do span,

quando digo acima estou dizendo, como se o texto estivesse uma linha acima.

Desculpa, apesar de ter lido o tópico, não sei se interpretei direito... Porém já que você quer que o texto que essta dentro do span seja mostrado como se estivesse uma linha acima do bloco... Então inseri a tag span e seu conteudo acima do bloco, não precisa usar uma lista para inserir o bloco (pelo que entende).

 

Seria algo mais ou menos assim:

 

<a name="LnkRodBar" href="pedidos/incluir_pedido.php" target="centro"><span>Incluir Pedidos</span></a>
<li id="RodIcon01" title="Incluir Pedidos">
</li>

[Desbravador 0]

Então deixiei da seguinte forma:

css:

#Rodape #RodBar li a:hover{
	height: 40px;
	width: 	45px;
	background:#FFF;
	display: block;
	filter:alpha(opacity=30);
	opacity:0.30;
}

#Rodape #RodBar li a span{ display: none; }
#Rodape #RodBar #RodIcon01{ background: url(../img/rodape/bt_incluirPedido.png) no-repeat 0px 3px;}

html:

<li id="RodIcon01" title="Incluir Pedidos">
<a name="LnkRodBar" href="pedidos/incluir_pedido.php" target="centro"><span>Incluir Pedidos</span></a>
</li>

dessa forma está funcionando porem não está imprimindo o conteudo do span , detalhe quero q o conteudo apareça acima da imagem.

[programador php 0]

#Rodape #RodBar li a:hover span {
	 display: block;
}

coloca isso também

 

abraço

[Desbravador 0]

Valeu pela resposta porém isso ainda não resolveu meu problema.

Se tiver outra dica posta ai,

abraço.