CSS Reset, corrigir problemas de renderização nos browsers

Apesar de não ser mais novidade para quem já trabalha profissionalmente com desenvolvimento web, muitos aindas não conhecem a maneira de corrigir problemas de renderização nos browsers.

CSS Reset faz com que todas as propriedades das tags sejam zeradas desde o início, através dos seletores que aplicam no HTML e/ou XHTML. Quem pesquisar por CSS Reset vai encontrar um padrão que promete fazer com que os principais browsers que dominam o mercado, renderizem de igual pra igual. Eu, que uso o IE7, IE6, Firefox, Opera e Netscape para testar meus trabalhos, tive alguns probleminhas entre eles, com a tag <table>. Então, fiz um ajuste para solucionar o problema. Abaixo, segue o CSS Reset que uso no meu dia-a-dia:

[css]/* CSS Reset de Thalis Valle */

html, body, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, dl, dt,
dd, ol, ul, li, fieldset, form, label, legend, table,
caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
font-family: inherit
}

img {
display:block
}

:focus {
outline: 0
}

ol, ul {
list-style: none
}

table {
border-collapse: separate;
border-spacing: 0
}

caption, th, td {
text-align: left;
font-weight: normal
}

lockquote:before, blockquote:after, q:before, q:after {
content: “”
}

blockquote, q {
quotes: “” “”
}
[/css]

Aproveito para deixar muma dica, que é sempre setar as propriedades de estilo e tamanho de fonte no seletor body. Exemplo:

[css]
body {
font-family: verdana, Arial;
font-size: 0.9em;
}
[/css]

Tags: Web Design e CSS

Este artigo foi postado em Quinta, abr 10th, 2008 às 8:46 PM na categoria Web Design e CSS. Você pode ver todos os comentários deste artigo, cadastrando em seu navegador ou software, o endereço Feed: RSS 2.0.

Deixe seu comentário logo abaixo, ou envie trackback.