« Jobs' Keynote: extra-ordinary, incredible, tremendous, amazing, unprecedented, great, revolutionary, unbelievable, most successful release ever... | Main | links for 2008-01-18 »
Saturday
Jan192008

CSS: Strip Away all Styling

Every browser has its own set of default styling for web pages. In case a particular website doesn't provide enough styling for a certain element, it applies these instead. The differences between browsers can result into unforeseen results. A good example of this behavior is the difference in margins and paddings defined for lists (<ul>, <ol>, <dl>).

One technique you could use is:

* {
margin: 0; padding: 0;
}


Yes, this will neutralize everything to 0 margin and padding, but it'll also have its effects on headings, forms, blockquotes, etc. Everything will be aligned crisply to the left side of the page, while this may not entirely be your intention.



@charset "utf-8";
/*-- Initialization Stylesheet --*/

/* v2.1, by Faruk Ates - www.kurafire.net
Addendum by Robert Nyman - www.robertnyman.com */

/* Neutralize styling:
Elements we want to clean out entirely: */
html, body, form, fieldset {
margin: 0;
padding: 0;
font: medium Calibri, Arial, Verdana, Helvetica, sans-serif;
}

/* Neutralize styling:
Elements with a vertical margin: */
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address {
margin: 0;
padding: 0;
}

/* Apply left margin:
Only to the few elements that need it: */
li, dd, blockquote {
margin-left: 1em;
}

/* Miscellaneous conveniences: */
form label {
cursor: pointer;
}
fieldset {
border: none;
}

/* Form field text-scaling */
input, select, textarea {
font-size: 100%;
}

Reader Comments

There are no comments for this journal entry. To create a new comment, use the form below.

PostPost a New Comment

Enter your information below to add a new comment.

My response is on my own website »
Author Email (optional):
Author URL (optional):
Post:
 
Some HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>