Ir para conteúdo

POWERED BY:

Arquivado

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

Eduardo Giullyanny

a e a:hover

Recommended Posts

Estou com um links em uma lista ordenada e eu gostaria q meu css fosse aplicado, mas ele está aplicando mas incluindo linhas...

 

a lista.:

 

<div id="news">
           <h1><span>news</span></h1>
           <dl>
               <a href="#">
               <dt>Catalão agora também tem LIV</dt>
               <dd>Acabaca de ser inaugurado mais uma filial do grupo Liv.</dd>
               </a>
               <a href="#">
               <dt>IML em São Luis de Montes Belos</dt>
               <dd>Clínica da LIV se torna referência na região e base do IML.</dd>
               </a>
               <a href="#">
               <dt>Nova sede da Funeréria São João Batista</dt>
               <dd>As obras de ampliação já estão em fase final, em breve inauguração</dd>
               </a>
           </dl>
           <h2><span>buscar</span></h2>
       </div>

 

e o css.:

 

#news {margin:0; padding:0; position:absolute; left:300px; float:left;}
#news h1 {background:url(../../_img/news.png) no-repeat; width:484px; height:18px; margin-bottom:10px;}
#news span {display:none;}
#news dt {font-family:"Helvetica Condensed", Helvetica, Arial, sans-serif; font-weight:bold; font-size:17px; color:#CAA25E;}
#news dd {font-family:"Helvetica Condensed", Helvetica, Arial, sans-serif; font-size:13px; color:#CAA25E;}
#news a:hover {text-decoration:underline; background-color:#CAA25E; color:#FEF0D3; padding:2px;}

 

Desde já agradeço pela ajuda...

 

amigos, gostaria de uma ajuda para isso.:

 

Vejam o site como fica;

 

Clique aqui

 

São os link do meio q tem tipo umas noticias, eu queria fazer tudo de uma vez, mas parece q num tem geito...

Gostaria de uma ajuda para dizer se isso tem com fazer de uma vez...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Primeira coisa: valide seu HTML » HTML Validator

 

Não coloque elementos de bloco dentro de elementos inline.

 

Faça assim:

<dt><a href="#">Catalão agora também tem LIV</a></dt>
<dd></a>Acabaca de ser inaugurado mais uma filial do grupo Liv.</a></dd>

e após isso, tente modificar no CSS.

 

:thumbsup:

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pra falar a verdade, eu nem faria assim, com lista de definição. Faria com um lista não-ordenada, que pra mim é o que mais cabe nessa situação.

 

Algo assim:

 

<ul>
<li>
	<h3><a href="#">Catalão agora também tem LIV</a></h3>
	<p><a href="#">Acabaca de ser inaugurado mais uma filial do grupo Liv.</a></p>
</li>
</ul>

O efeito :hover você põe no li.

 

:thumbsup:

Compartilhar este post


Link para o post
Compartilhar em outros sites

Colocar o mesmo link em elementos diferentes, apenas por questões semânticas, tende a ser um pouco tedioso para acessibilidade, redundante para desenvolvimento e consumista para o tráfego de bytes.

 

Ainda assim, se desejado utilizar o link no elemento completo, faz-se mais correto o uso de um <span> identificador de notícia.

 

<ul>
   <li><a><span>Manchete</span>Conteúdo da notícia</a></li>
</ul>

 

Para o formato proposto, a solução mais apropriada - ao meu ver - semanticamente falando, é o uso sim de listas de definição. Para resolver o problema dos links, temos duas opções:

 

Uma solução meio gambiarra que faria com que o :focus no DD sobrepusesse o elemento DT incluindo uma manchete oculta na DD. Solucionaria o problema mas eu não recomendaria.

 

O que eu recomendo para o caso, por questões semânticas, de acessibilidade e uso de recursos é a simples adição do complemento [leia mais] ou [notícia na íntegra] ao final da chamada.

 

<dl>
   <dt>Cielo é ouro e choro</dt>
   <dd>Vitória nos 50m nado livre, no Mundial de piscinas curtas, repete emoção de Pequim. <a href="http://globoesporte.globo.com/aquaticos/noticia/2010/12/cielo-voa-e-conquista-o-ouro-na-final-dos-50m-livre-do-mundial-de-dubai.html" title="Portal Globo: Esportes | Natação">[íntegra]</a></dd>
</dl>

Compartilhar este post


Link para o post
Compartilhar em outros sites
Colocar o mesmo link em elementos diferentes, apenas por questões semânticas, tende a ser um pouco tedioso para acessibilidade

Concordo, mas achei (acho) que como isso vai ser gerado dinamicamente, não seria problema.

 

Para o formato proposto, a solução mais apropriada - ao meu ver - semanticamente falando, é o uso sim de listas de definição.

Eu já não concordo, não vejo em que "Acabaca de ser inaugurado mais uma filial do grupo Liv." define "Catalão agora também tem LIV"

 

:thumbsup:

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.