The importance of doctype in stylesheets and html

I don’t know if many people realize how important it is to place the appropriate DOCTYPE declaration at the top of their HTML files so I have created the following HTML sample to illustrate some of the value:

 “-//W3C//DTD XHTML 1.0 Transitional//EN”

  <title>Table Test</title>
  <style type=”text/css”>
    font-family: Arial,
    font-size: 1.3em;
   This is a simple page to test the
   effect of doctypes and what they
   do with your CSS.
  <table border=”1″>

This is what it looks like when the DOCTYPE is in place, notice how the font size we set in the body tag trickles down to all the child tags:
When we take out the DOCTYPE it ignores the font of the parent and renders thus:
I have provided the most common DOCTYPE declarations below and you may find them usefull:

 “-//W3C//DTD HTML 4.01 Transitional//EN”
 “-//W3C//DTD XHTML 1.1//EN”
 “-//W3C//DTD XHTML 1.0 Strict//EN”
 “-//W3C//DTD XHTML 1.0 Transitional//EN”


The !important rule and overriding existing styles

I learnt something new in SharePoint 2007 today.  Sounds noddy, but I didn’t know how to override styles in the core.css file.  Now I do!
CSS attempts to create a balance of power between author and user style sheets. By default, rules in an author’s style sheet override those in a user’s style sheet.
However, for balance, an “!important” declaration (the delimiter token “!” and keyword “important” follow the declaration) takes precedence over a normal declaration. Both author and user style sheets may contain “!important” declarations, and user “!important” rules override author “!important” rules. This CSS feature improves accessibility of documents by giving users with special requirements (large fonts, color combinations, etc.) control over presentation.
Declaring a shorthand property (e.g., ‘background’) to be “!important” is equivalent to declaring all of its sub-properties to be “!important”.
The first rule in the user’s style sheet in the following example contains an “!important” declaration, which overrides the corresponding declaration in the author’s style sheet. The second declaration will also win due to being marked “!important”. However, the third rule in the user’s style sheet is not “!important” and will therefore lose to the second rule in the author’s style sheet (which happens to set style on a shorthand property). Also, the third author rule will lose to the second author rule since the second rule is “!important”. This shows that “!important” declarations have a function also within author style sheets.
/* From the user’s style sheet */
p { text-indent: 1em ! important }
p { font-style: italic ! important }
p { font-size: 18pt }
/* From the author’s style sheet */
p { text-indent: 1.5em !important }
p { font: normal 12pt sans-serif !important }
p { font-size: 24pt }