Interesting Topics

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%;
}

Join in on the conversation

blog comments powered by Disqus

Ace on Tech is an independent blog about computer technology and the Internet (focusing on Web 2.0).

 Alex Manarpies's Facebook profile

You can subscribe to this site's content through RSS or e-mail.

Search this site

Featured articles

Sponsored Links

Recent

Find Ace

Mixx Twitter Google Facebook Delicious Digg Reddit StumbleUpon YouTube Storytlr FriendFeed

From the Mixx Community

Connect

You can comment using the following services:

Anonymous Comments Wordpress Login OpenID Logn Facebook Connect Disqus Comments

Meta

Pages