Noscope is a bi-weekly journal serving up snacksized portions of pointless stuff since 2001.
I also do freelance design and usability via dejligt.com

Vanilla CSS Un-Reset

Version 0.9.9

Vanilla is a CSS "un-reset" that works in tandem with CSS resets such as the Yahoo CSS Reset.

Browser defaults vary. Using a CSS reset, you can level the playing field and remove all those browser default styles, ensuring a consistent cross-platform experience.

What then? You rebuild. You re-style lists, paragraphs, headers, bullets and margins. Some of those rebuild styles are likely to be the same across your projects. That’s where Vanilla comes in.

Vanilla is meant to be dropped into your stylesheet, tweaked and handled to your liking. It’s meant as a very base stylesheet, so that you don’t have to start over every time.

Note: Vanilla includes a CSS Clearfix.

Vanilla

/**
* Start Vanilla CSS 0.9.9
*/
body {
	font: 9pt/1.5em Arial, Helvetica, sans-serif;
}
pre, code, tt {
	font: 1em/1.5em 'Andale Mono', 'Lucida Console', monospace;
}
h1, h2, h3, h4, h5, h6, b, strong {
	font-weight: bold;
}
em, i, dfn {
	font-style: italic;
}
dfn {
	font-weight:bold;
}
p, code, pre, kbd {
	margin:0 0 1.5em 0;
}
blockquote {
	margin:0 1.5em 1.5em 1.5em;
}
li ul, li ol {
	margin:0 1.5em;
}
ul, ol {
	margin:0 1.5em 1.5em 1.5em;
}
ul, ul li {
	list-style-type:disc;
}
ol, ol li {
	list-style-type:decimal;
}
dl {
	margin:0 0 1.5em 0;
}
dl dt {
	font-weight:bold;
}
dd {
	margin-left:1.5em;
}
table {
	margin-bottom:1.4em;
	width:100%;
}
th {
	font-weight:bold;
}
th, td, caption {
	padding:4px 10px 4px 5px;
}
tfoot {
	font-style:italic;
}
sup, sub {
	line-height:0;
}
abbr, acronym {
	border-bottom: 1px dotted;
}
address {
	margin:0 0 1.5em;
	font-style:italic;
}
del {
	text-decoration: line-through;
}
pre {
	margin:1.5em 0;
	white-space:pre;
}
img.centered, .aligncenter, div.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
img.alignright {
	display: inline;
}
img.alignleft {
	display: inline;
}
.alignright {
	float: right;
	margin-left: 10px;
}
.alignleft {
	float: left;
	margin-right: 10px;
}
* html .clearfix {
    height: 1%;
}
* + html .clearfix {
	display: inline-block;
}
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
 
* html .group {
    height: 1%;
}
* + html .group {
	display: inline-block;
}
.group:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
/**
* End Vanilla CSS
*/

Vanilla CSS Minified

Changelog

  • Version 0.9.7: Added new class, "group", which does the same as clearfix. Because Dan Cederholm said so.
  • Version 0.9.8: Switched to a new exciting clearfix which should work in all the browsers. The author has tested it, and I have tested it. If you've been having trouble with clearing floats in IE8, this update should fix it.
  • Version 0.9.9: Tweaked clearfix, again.