Ultimate Drupal Theming! | Unleash the power of Drupal Theming System! | Learn more!
CSS Reset
One of the most essential css routine for themers is put a css reset definitions on any theme he creates, thanks to all the inconsistencies of different browsers, we have to master the creation of sets of css definitions which would "reset" all the default behaviors of browsers. If you don't know, browsers have default margins, paddings, font size, height, etc. which automatically loads if you have not defined them in your own sets of css.
For the meantime, here's my version of css reset:
/* Base Font sizes */
body { margin: 0px; font-family: Arial, Helvetica, sans-serif; font-size: .75em; line-height: 1.5em; }
/* Links */
a { text-decoration: none; }
a:hover { text-decoration: underline; }
/* Header Text */
h1,h2,h3,h4,h5,h6 { margin: 0px; }
h1 { font-size:2.25em; line-height:1.17; }
h2 { font-size:2em; }
h3 { font-size:1.75em; }
h4 { font-size:1.5em; }
h5 { font-size:1.25em; }
h6 { font-size:1em; }
/* Body Text */
p, blockquote { margin: 0px; }
q {}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
/* Form Elements */
form, textarea { margin: 0px; }
fieldset { margin: 0px; padding: 0px; }
input, legend { padding: 0px; }
/* List */
ul, ol { margin: 0px; padding: 0px; }
li { list-style: none; }
/* Table */
caption {}
table { border-collapse: collapse; }
thead {}
tbody {}
tfoot {}
tr {}
th {}
td { vertical-align: top; }
/* Phrase Elements */
abbr {}
acronym {}
/* Phrase Elements */
address {}
/* Others */
iframe { border: none; }







