DESAFIO ENCERRADO Confira as soluções.
A imagem acima é um screenshot da renderização do alfabeto em duas cores alternadamente.
Este desafio número 9 consiste em obter a renderização mostrada na figura, usando HTML e CSS.
font-family: monospace;font-size:140%;Se você encontrar a solucão mande para mim via email o arquivo .html
maujorcss[arroba]maujor[ponto]com – com a sua solução. E, não poste a solução nos comentários, para que outros possam tentar.
Desafio encerrado. Não envie soluções.
Para cada solução correta recebida eu postarei nos comentários informando o nome do autor.
Dentro de aproximadamente 30 dias, postarei a solução.
Ah! não se esqueça que você pode se inscrever para receber email informando quando novos comentários forem postados nos arquivos no Blog e assim acompanhar uma matéria de seu interesse.
Em 2006 comecei a publicar nesse blog uma série de desafios CSS que consistiam em…
Há muito tempo que eu não publico um "Teste seu conhecimento". Esta semana, revendo algumas…
Introdução Elementos da marcação HTML podem ser aninhados uns dentro de outros, criando-se uma cadeia…
HTML5? Web universal? É comum eu me deparar com dúvidas sobre a HTML5 não só…
Quem é Tab Atkins Jr? Tab Atkins Jr, um desenvolvedor americano, trabalhou durante muitos anos…
Pessoal, a BrazilJS Conf 2013 disponibilizou para o Maujor cupons de desconto para serem oferecidos…
View Comments
Vejo como meu html é fraco quando entro na rede e leio seus posts.
No caso em que ele não especifica qual usar, uso vários atuais do mercado, exceto IE.
Qual o programa que vocês usam para ver o resultado final ?
Não existe solução correta. Existe a mais correta para a situação que você se encontrar. O Maujor mostrou a solução mais alinhada com os padrões, mas que não facilita a acessiblilidade, isso ja mostra que a solução varia de caso a caso. Por isso que a web é esse caos de sobrinhos por aí...todo mundo fazendo de um jeito.
Agora fiquei curioso. Qual a solução correta?
Pelo exemplo do Diego Eis no Tableless, ele funciona do ie6 pra cima. Mas aí você seria, semanticamente, obrigado a usar table. O que no contexto geral ñ faz muito sentido eu acho.
Se tivesse que fazer isso em um projeto real, dependendo do público alvo, eu provavelmente faria utilizando :nth-child(2n+1), e usaria jQuery pros outros browsers.
Bom pessoal,
Com dois ou mais span, quem conseguiu a renderezição sugerida no desafio ganhou pontos. Só que o Maujor citou:
"para desenvolver segundo os padrões não basta obter o efeito visual proposto, é preciso estudar com cuidado como marcar o documento."
Ao meu ver, se estivesse trabalhando em um projeto que tivesse uma necessidade igual a sugerida no desafio, jamais marcaria o meu documento com somente dois span, a menos que o alfabeto colocado ali não tivesse necessidade alguma de leitura por parte do usuário (algo bem improvável, certo?)...
[]'s
fazer pensando em acessibilidade ja é "ninja"...
Acho que se levarmos em conta que isso é um desafio para testar as habilidades,a acessabilidade ganha menos notoriedade.Então faça do jeito mais "ninja" possível.