Ir para conteúdo

Arquivado

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

mshonorato

Tabela html - classes

Recommended Posts

Boa tarde pessoal,

Aqui estou eu com mais um problema bobo que não consigo resolver.

Fiz uma tabela "<table class='collapse'>" e no CSS formatei conforme abaixo:

table.collapse{
border-collapse: collapse;
font-family:Arial,Verdana,Helvetica,sans-serif,Trebuchet MS;
color:#555;
}

table.collapse tr, table td{
border: solid 1px #DCDCDC;
}

table.collapse th{
color:#FFF;
/*background-color:#145ba8;*/
background-color:#a56414;
}

table.collapse a{
text-decoration:none;
color:#555;
}

table.collapse a:hover{
color:#a56414;
font-weight:bold;
}

Não sei o porque, mas agora qualquer tabela que eu crie, ela recebe a borda dessa collapse.

Por exemplo:

Criei outra tabela "<table class='teste'>" mesmo que lá no CSS eu formate ela table.teste{} ela recebe as bordas da collapse.

Na minha tela inicial de login, tem uma tabela <table class="login"> e acontece a mesma coisa.

 

já tentei tirar o "table." da frente do collapse mas o problema persiste.

Alguém tem ideia do que pode ser?

Desde já obrigado!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pelo que entendi o problema está nessa linha de código CSS

 

table.collapse tr, table td{
  border: solid 1px #DCDCDC;
}

Como está definido table td ele vai colocar uma borda em tudo que for table e conter td

O que você poderia fazer é criar uma outra class tipo:

table.no-collapse tr{
  border: none;
}

Ai na table colocar class="no-collapse"

 

 

Fiz essa alteração no seu código CSS veja se dá para entender:

 

Acrescentei junto com a class collapse o no-collapse

table.collapse,table.no-collapse{border-collapse: collapse;
font-family:Arial,Verdana,Helvetica,sans-serif,Trebuchet MS;
color:#555;
}


table.collapse tr{
border: solid 1px #DCDCDC;
}


table.no-collapse tr{
border: solid 1px #DCDCDC;
}


table.collapse th,table.no-collapse th{
color:#FFF;
/*background-color:#145ba8;*/
background-color:#a56414;
}


table.collapse a, table.no-collapse a{
text-decoration:none;
color:#555;
}


table.collapse a:hover, table.no-collapse a:hover{
color:#a56414;
font-weight:bold;
}

Compartilhar este post


Link para o post
Compartilhar em outros sites

Infelizente não funcionou colega.

 

É como se as outras tabelas tivessem 2 classes, se eu colocar uma nova e adicionar borda, fica 2 bordas.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bom dia,

Revolvi, separando no CSS o TR e TD.

Estava assim:

table.chamados tr, td{
border: solid 1px #DCDCDC;
}

Deixei assim:

table.chamados tr{
border: solid 1px #DCDCDC;
}

table.chamados td{
border: solid 1px #DCDCDC;
}

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.