Ir para conteúdo

POWERED BY:

Arquivado

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

Hanover

Bug no CSS

Recommended Posts

Olá!

Estou fazendo uma página em xhtml com dtd stric.

Tem uma td que eu não consigo renderizar nem a pau!

So funciona se eu colocar um style e os valores que eu desejo, mas ai perde a facilidade do estilo em cascata.

 

Eu tenho um td com id="planos"

 

td#planos {	font-size:16px; 	font-style:italic; 	font-weight:bold; 	color:white; 	text-align:left;	width:343px;}
E tenho varias classes de td's que tem como características em comum os atributos do id planos.

Pois bem. Meus css não renderizou corretamente apenas um td, dos varios que tem no código.

 

Na página ele é apresentado assim.

 

<table class="bordas">  <tr>    <td colspan="3" id="planos" class="periodicidade"><span>    </span> Tabela de descontos por periodicidade</td>  </tr>
O CSS da classe bordas e periodicidade são os seguintes:

 

table.bordas {	border-collapse:collapse;	background-color:#EAEAEA; 	text-align:center; }td.periodicidade { background-color:white; color:#7DBB0E; white-space:pre; }td.periodicidade span { background-color:#7DBB0E; }
Então, o que esse código faz?

A classe bordas define bordas juntas ('colapsadas'), com uma cor cinza e alinhadas ao centro.

O id planos define que a fonte terá 16px, em itálico e negrito, da cor branca, com texto alinhado a esquerda e td de largura 343px.

E finalmente, a classe periodicidade daria uma nova aparência a essa td, com uma fonte de cor esverdeada e fundo branco.

O atributo white-space:pre serve para o elemento que contém o atributo, no caso a td, considerar todos os espaços em branco digitados no código.

 

Porque eu fiz isso?

Então, é melhor ver a página pra entender (favor, desconsiderar a feiura dos banners! =P essa página ainda esta em testes)!

 

A página do jeito que eu quero que fique: http://www.sodavirtual.com.br/gigahost_novo/e-commerce1.html

A página com o bug: http://www.sodavirtual.com.br/gigahost_novo/e-commerce.html

O <span> com os espaços vazios fica com uma aparência de um quadrado, na cor verde!

 

Não sei porque motivo o primeiro link, que contém o código mostrado acima, não esta validando o atributo color!

Pra página ficar do jeito que eu queria eu tive que acrescentar um style no código.

 

<table class="bordas">	  <tr>		<td colspan="3" id="planos" class="periodicidade" style="background-color:white; color:#7DBB0E; white-space:pre;"><span>    </span> Tabela de descontos por periodicidade</td>	</tr>
Ao fazer isso eu perco a possibilidade de no futuro alterar os atributos dessa td apenas no código CSS.

Sem contar que esse erro é muito bizarro.

 

Enfim, se você perceberem que eu so falei asneira me avisem qual foi meu erro, ok?

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.