Blog do Bernard De Luna - Design, web, planejamento e muito mais…

Por que o meu site nunca começa encostado na margem superior e a esquerda do meu navegador?
Como fazer uma tabela em html sem engessar tags como cellpadding e celspacing dentro do html?
Como tirar o sublinhado de todos os links sem ficar formatando de um a um?
E aquela imagem que fica com uma borda azul bem feia quando você a insere dentro de um link?

Muitas pessoas já passaram por isso quando começaram a seguir o caminho do webdesign. Posso dizer que a solução é MUITO simples, só exige conhecimento para o desenvolvimento do css após essa técnica chamada CSS Reset.

É sabido que a maior dificuldade hoje dos desenvolvedores de html e css é a compatibilidade do seu código em navegadores diferentes como internet explorer (o qual já existe diferença entre ie6 e ie7), firefox, opera, safari e outros. Muitas pessoas acreditam que é só colocar “bonitinho” no internet explorer e “correr para o abraço”, mas imagina se em tudo na vida fosse assim:

1. Cada pneu de uma marca teria o seu próprio tipo de rosca e cada carro o seu modelo de pinos, sendo bem difícil achar um pneu que fosse compatível com o seu carro.
2. Cada teclado e mouse de marcas diferentes teriam suas próprias entradas, coitado da intell e cia de fazer computadores que tivessem entradas compatíveis para CADA periférico específico.
3. E se cada tomada de produtos eletrônicos fossem de formatos diferentes, até você procurar e achar uma tomada compatível seu aparelho você já se sentirá um Fred Flinstones (YA BA DA BA DOOO!)

Acho que você já pescou a idéia né? Os navegadores reconhecem seus padrões para as tags de formas diferenciadas. Sabemos que existe um padrão já específico criado pelo W3c para essa renderização e suas características, constrói quem manda e ganha dinheiro quem tem juízo.

Voltando ao CSS Reset, cada desenvolvedor tem o seu próprio CSS reset, criado para resolver suas necessidades, então você pode muito bem procurar no google esta expressão e achar muitos desenvolvedores que utilizam essa técnica de um jeito ímpar.

O meu CSS Reset é assim:

/* zerando */
* {
margin:0;
padding: 0;
list-style: none;
border: 0;
text-decoration: none;
}
:focus {outline: 0;}
table {border-collapse: collapse;width: 100%;}
/* padronizando */
html, body {height: 100%;}
hr {display: none;}
input.zerado {border: 0;}
.imgleft {float: left; padding: 5px;}
.imgright {float: right; padding: 5px;}
h2, h3, h4, h5, h6 {font-size: 100%; line-height: 100%;}
ol {list-style: decimal;}
blockquote, q {quotes: "" ""}


Segue abaixo uma lista de alguns que já falaram e publicaram o seu CSS Reset:

1. David Hellsing (tripoli)
2. Thalis Valle
3. Eric Meyer
4. yahoo developer
5. Diego Eis - Tableless

Se você também tem sua maneira de Zerar os estilos em CSS do seu site, faça um post no seu blog e mande um trackback ou comentário aqui para que eu possa incluí-lo na lista também.