Ir para conteúdo

POWERED BY:

Arquivado

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

Ericsson Berg

Problema com tabela e mouse hover - destacar linha

Recommended Posts

Pessoal, estou com o seguinte problema:

 

Tenho uma tabela zebrada que está funcionando tudo OK, porém quando incluí um CSS para destacar a linha onde o mouse

estiver em cima, este CSS não funciona.

 

Se eu deixar a tabela sem nenhum CSS o :hover funciona, mas qaundo está com o CSS para deixar zebrada ele suprime o de destacar a linha.

 

Como resolvo?

 

Essa regra:

#tb_estobs_resumo tbody .tr2_estobs_resumo:hover{
    background:#FFFF99;
    color:#FF0000;
    /*   z-index: 1000; */
}

não sobrescreve esta:

#tb_estobs_resumo tbody .tr2_estobs_resumo td{

    font: 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    border-right: 1px solid #C1DAD7;
    border-bottom: 1px solid #C1DAD7;
    background: #fff;
    padding: 6px 2px 6px 10px;
    color: #4f6b72; 
}

Consigo fazer funcionar até o td, mas não antes:

#tb_estobs_resumo tbody .tr2_estobs_resumo td:hover{
    background:#FFFF99;
    color:#FF0000;
    /*   z-index: 1000; */
}

Compartilhar este post


Link para o post
Compartilhar em outros sites

Talvez a classe do hover da lista zebrada esteja sendo mais importante que o novo hover.

Tende adicionar tags como !important ao final do estilo. Exemplo:

.suaclasse:hover{
   width: 100px !important;
   height: 100px !important;
   color: #FFF !important;
}

O método !important significa que, independente do estilo que estiver na mesma classe abaixo dele, ele ainda continuará valendo. O CSS lê o código em forma de cascata, ou seja, o que estiver no fim é o que vai valer, por isso surgiu o !important, pra dizer ao CSS que mesmo não estando por último, ele é o que vai valer.

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.