CSS Reset for all Web Browser

css_reset.rb

# minimize reset tag level, so that user can override them
styles = {}

Object.class_eval do
  define_method :style do |tag, properties|
    styles[tag] ||= {}
    styles[tag].merge!(properties)
  end
end

def css(tags, properties)
  tags.split.each do |tag|
    style(tag, properties)
  end
end

css("html body div span applet object iframe h1 h2 h3 h4 h5 h6 p blockquote pre a abbr acronym address big cite code del dfn em img ins kbd q s samp small strike strong sub sup tt var b u i center dl dt dd ol ul li fieldset form label legend table caption tbody tfoot thead tr th td article aside canvas details embed  figure figcaption footer header hgroup  menu nav output ruby section summary time mark audio video", {
      "margin" => "0",
      "border" => "0",
      "font-size" => "100%",
      "font" => "inherit",
      "vectial-align" => "baseline"})
css("article aside details figcaption figure footer header hgroup menu nav section", {"display" => "block"})
css("body", {"line-height" => "1"})
css("ol ul", {"list-style" => "none"})
css("blockquote q", {"quotes" => "none"})
css("blockquote:before blockquote:after q:before q:after", {"content" => "none"})
css("table", {"border-collapse" => "collapse", "border-spacing" => "0"})

styles.each do |tag, properties|
  puts "#{tag} {"
  properties.each do |key, value|
    puts "  #{key}: #{value};"
  end
  puts "}"
end

reset.css

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
   */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}

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

ruby.reset.css

html {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
body {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  line-height: 1;
}
div {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
span {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
applet {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
object {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
iframe {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
h1 {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
h2 {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
h3 {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
h4 {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
h5 {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
h6 {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
p {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
blockquote {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  quotes: none;
}
pre {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
a {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
abbr {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
acronym {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
address {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
big {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
cite {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
code {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
del {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
dfn {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
em {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
img {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
ins {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
kbd {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
q {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  quotes: none;
}
s {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
samp {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
small {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
strike {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
strong {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
sub {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
sup {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
tt {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
var {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
b {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
u {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
i {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
center {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
dl {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
dt {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
dd {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
ol {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  list-style: none;
}
ul {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  list-style: none;
}
li {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
fieldset {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
form {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
label {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
legend {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
table {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  border-collapse: collapse;
  border-spacing: 0;
}
caption {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
tbody {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
tfoot {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
thead {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
tr {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
th {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
td {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
article {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
aside {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
canvas {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
details {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
embed {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
figure {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
figcaption {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
footer {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
header {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
hgroup {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
menu {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
nav {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
output {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
ruby {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
section {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
  display: block;
}
summary {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
time {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
mark {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
audio {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
video {
  margin: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vectial-align: baseline;
}
blockquote:before {
  content: none;
}
blockquote:after {
  content: none;
}
q:before {
  content: none;
}
q:after {
  content: none;
}