CSS3 – A pseudo-classe :empty
Postado por: Pedro Rogério emEssa pseudo-classe é aplicada a elementos vazios do HTML, ou seja, imagine que você tem uma tag p dessa forma:
<p></p>
Se no CSS você criar uma definição dessa forma:
p:empty { background-color:#FF0000; }
Todos os parágrafos vazios da página ficarão com a cor de fundo vermelha. A primeira impressão pode parecer inútil utilizá-la, mas imagine onde o conteúdo é gerado dinamicamente, seria uma boa pra vc descobrir quais tags estão sem conteúdo. Para que fique mais claro o entendimento do tutorial, dêem uma olhada no seguinte exemplo. Lembrando que só funciona no Mozilla, Konqueror e Safari.
Referências
Sobre Pedro Rogério
Pedro Rogério é desenvolvedor web por paixão, não saberia fazer melhor outra coisa. Além de escrever para o Pinceladas da Web também escreve para o CSS no Lanche, blog voltado ao desenvolvimento front-end.
Esta dica é legal para que usa algum tipo de CMS e quer debugar.
É bom também pra quem vai colocar um CMS na mão do cliente. Muitas vezes o cliente escreve o texto, dá vários ENTER, depois volta e vai editar uma parte anterior, dá mais alguns ENTER… ai já viu né, fica aquele monte de parágrafo vazio.
Um
p:empty { display:none; }resolveria o problema. Apenas resolveria, porque, se tratando de CSS3… até que a gente possa usá-lo, vai demorar bastante.@Jader,
Com certeza Jader, mas no atual momento isso é bom para nós desenvolvedores descobrir-mos problemas em nossa página, mais uma forma de debugar o código.
@Jade, eu concordo com o Pedro Rogério, quem trabalha com linguagens dinamicas tem a opção de fazer um if e testar, se o conteudo for igual a nada ele nem mostra o . Acho que ele se referiu a uma forma de encontrar lugares onde os ’s nao tem nada =)