Removing Browser Default CSS Styles

There are too many browsers to count nowadays and each browser subjects web pages to its own default CSS styles. These defaults make it painful to implement web pages that look consistent across the numerous available browsers. Wouldn't it be nice if you could just sweep away those default CSS styles and start with a clean slate?

Well, it can be done. The CCS stylesheet shown in Listing 1, clean_slate.css, does just that. It resets the various styles that make cross-browser support problematic for web sites. The downside, of course, is that you will have to craft some CSS styles to make your web pages look good.

Listing 1: "clean_slate.css"
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6,
   pre, form, fieldset, input, textarea, p, blockquote,
   th, td
   { margin:0; padding:0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset, img { border:0; }
address, caption, cite, code, dfn, em, strong, th, var
   { font-style:normal; font-weight:normal;}
ol, ul { list-style:none; }
caption, th { text-align:left; }
h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr, acronym { border:0; }


No comments yet. Be the first.

Leave a Comment

Comments are moderated and will not appear on the site until reviewed.

(not displayed)