Revision: 15175
Updated Code
at February 3, 2010 12:51 by wizard04
Updated Code
/**************************************************************************************************/ /*This stylesheet was created for HTML 4.01 using CSS 3 (and older) /*Tested on Windows versions of Firefox 1.5-3.0, IE 6-7, Safari 3.2, Opera 9.2-9.6, and K-Meleon 1.5 /* /*I've put helpful classes into a separate stylesheet. PLEASE CUSTOMIZE THAT STYLESHEET AS NOTED! /*IE-specific stylesheets include fixes or fallbacks for both of these stylesheets, so comment out relevant rules /* if you won't be using the classes. /* /*Because of too many browser inconsistencies, I have: /*- left the styling of form elements up to the browser (for the most part). /*- not set the outline property on anything (e.g., `:focus`). /* /*Elements included: /* Obsolete: /* app, bgsound, blink, comment, listing, marquee, multicol, nobr, plaintext, sound, spacer, wbr, xmp /* Deprecated: /* applet, basefont, center, dir, font, isindex, menu, s, strike, u /* Non-standard: /* embed, noembed /* Standard: /* a, abbr, acronym, address, area, b, base, bdo, big, blockquote, body, br, button, caption, cite, /* code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, /* head, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, meta, noframes, noscript, /* object, ol, optgroup, option, p, param, pre, q, samp, script, select, small, span, strong, style, sub, sup, /* table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, ul, var /* /*1.0: The Basics /*2.0: Block-Level Elements /* 2.1: Headers /* 2.2: Lists /* 2.3: Tables /*3.0: Inline Elements /* 3.1: Hyperlinks /*4.0: Forms /* 4.1: Buttons /* 4.2: Text Inputs /* 4.3: Choices /*5.0: Media-Specific /* 5.1: Paged Media /* 5.2: Audible Media /**************************************************************************************************/ /***********************/ /*** 1.0: The Basics ***/ /***********************/ bgsound, comment, sound { display:none; } listing, xmp { white-space:pre; } app, blink, listing, marquee, multicol, nobr, plaintext, spacer, wbr, xmp, applet, center, dir, font, menu, s, strike, u, embed, noembed, a, abbr, acronym, address, b, big, blockquote, body, br, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, label, legend, li, map, noframes, noscript, object, ol, optgroup, option, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var { margin:0; padding:0; border:0 solid #000; font-style:inherit; font-weight:inherit; font-size:inherit; text-decoration:inherit; background-color:transparent; color:inherit; line-height:1.25; font-family:inherit; text-align:inherit; vertical-align:baseline; } html { background-color:#FFF; } body { padding:8px; font-family:sans-serif; font-size:95%; /*since sans-serif seems bigger*/ color:#000; font-style:normal; font-weight:normal; text-decoration:none; text-align:left; } /*********************************/ /*** 2.0: Block-Level Elements ***/ /*********************************/ p, ul, ol, dl, pre { margin:1em 0; } p:first-child, blockquote:first-child, ul:first-child, ol:first-child, dl:first-child, pre:first-child { margin-top:0; } p:last-child, blockquote:last-child, ul:last-child, ol:last-child, dl:last-child, pre:last-child { margin-bottom:0; } pre { font-family:"Envy Code R", "Consolas", "DejaVu Sans Mono", "Anonymous Pro", "Courier New", monospace; } blockquote { margin:1em 1.25em; quotes:none; } blockquote:before, blockquote:after { content:""; } blockquote::before, blockquote::after { content:""; } address { font-style:normal; } center { text-align:center; } /*** 2.1: Headers ***/ h1, h2, h3, h4, h5, h6 { margin:1em 0; font-weight:bold; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; } h1 { font-size:2em; margin-bottom:0.5em; } h2 { font-size:1.7em; margin-bottom:0.59em; } h3 { font-size:1.4em; margin-bottom:0.71em; } h4, h5, h6 { font-size:1em; } hr { margin:0.5em 0; /*no way to get rid of the margin in IE, so I'll include it for consistency*/ border-width:2px; padding-top:1px; border-style:solid; border-color:#EAEAEA #BBB #676767 #EAEAEA; background-color:#BBB; color:#BBB; /*for IE*/ } /*** 2.2: Lists ***/ ul { list-style-type:disc; } ul ul { list-style-type:circle; } ul ul ul { list-style-type:square; } ul, ol, dir { padding-left:1.25em; list-style-position:outside; } ol { padding-left:2em; } menu { list-style-type:none; } dt { margin-top:0.5em; } dt:first-child { margin-top:0; } dd { margin-left:1.25em; } /*** 2.3: Tables ***/ table { border-collapse:collapse; border-spacing:0; } caption { caption-side:top; text-align:center; } td { vertical-align:top; } /****************************/ /*** 3.0: Inline Elements ***/ /****************************/ em, i, cite, var, dfn, ins { font-style:italic; } strong, b { font-weight:bold; } code, kbd, samp, tt, var { font-family:"Envy Code R", "Consolas", "DejaVu Sans Mono", "Anonymous Pro", "Courier New", monospace; } code, var { background-color:#E6E6E6; } samp { color:#444; } del, strike, s { text-decoration:line-through; } u { text-decoration:underline; } /*Except for IE, browsers automatically add quotes around a `q` element; this removes them.*/ q:before, q:after { content:""; } q::before, q::after { content:""; } big { font-size:120%; } /*why isn't this deprecated?*/ small, sup, sub { font-size:80%; } sup { vertical-align:super; } sub { vertical-align:sub; } /*** 3.1: Hyperlinks ***/ a img { border:0; } /* Browsers seem to ignore the implicit pseudo-classes for anchors in terms of specificity; you can override them all at once with the selector `a` even though they are more specific. This is corrected when set explicity, as below. Note, however, that these will now be more tedious to override in other stylesheets. */ a:link { text-decoration:underline; color:#00E; } a:visited { color:#551A8B; } a:focus { } /*I don't use `a` elements as anchors (why would you?), so I won't make these selectors so specific*/ /*a:link:hover { } a:link:active { color:#F00; }*/ a:hover { } a:active { color:#F00; } /******************/ /*** 4.0: Forms ***/ /******************/ fieldset { display:block; padding:0.5em; border:1px solid #BBB; /*note: setting a border removes IE's curved corners*/ } legend { padding-left:3px; padding-right:3px; } isindex { display:block; position:static; } input, button, select { vertical-align:middle; } select[size], select[multiple], textarea { vertical-align:text-top; } input[type="file"] { } /*** 4.1: Buttons ***/ input[type="submit"], input[type="reset"], input[type="button"], button { } input[type="image"] { } /*** 4.2: Text Inputs ***/ input[type="text"], input[type="password"] { } textarea { overflow:auto; } /*** 4.3: Choices ***/ input[type="checkbox"], input[type="radio"] { } select { } optgroup { font-weight:bold; font-style:italic; } optgroup option { font-weight:normal; font-style:normal; padding-left:1em; } option { padding-right:0.75em; /*for Firefox*/ } option[disabled] { color:#999; } /***************************/ /*** 5.0: Media-Specific ***/ /***************************/ /*audio, aural (deprecated), braille, embossed, handheld, print, projection, screen, speech, tty, tv*/ @media aural, braille, embossed, speech, tty { /*img { content:attr(alt); } /*this is what's implied for relevant media, correct?*/ img[alt=""] { display:none; } img:not([alt]) { display:none; } } @media handheld { *, *:before, *:after { float:none !important; } *, *::before, *::after { float:none !important; } body { padding:2px; font-size:100%; } pre { white-space:pre-wrap; } blockquote { margin:1em 0 1em 1em; } dd { margin-left:1em; } h1 { margin-top:0.5em; } h2 { margin-top:0.59em; } h3 { margin-top:0.71em; } ul, ol { padding-left:0; list-style-position:inside; } img { max-width:100%; } } @media tv { } /*** 5.1: Paged Media ***/ @media embossed, print, projection, tv { * { page-break-before:auto; page-break-inside:auto; page-break-after:auto; } p, blockquote, li, dd, pre, h1, h2, h3, h4, h5, h6 { orphans:2; widows:2; } h1, h2, h3, h4, h5, h6 { page-break-after:avoid; } dt { page-break-after:avoid; } dd { page-break-before:avoid; } table, address, a { page-break-inside:avoid; } } @media embossed, print { body { padding:0; } a { text-decoration:none; } /*consider making sure it is still distinguishable on a B&W printer or to a color-blind user*/ } @media print { html { background-color:transparent; } body { font-size:11pt; font-family:"Times New Roman", Times, serif; } pre, code, kbd, samp, tt, var { font-family:"Envy Code R", "Consolas", "DejaVu Sans Mono", "Anonymous Pro", "Courier New", monospace; } a:visited { color:#00E; } a[href^="#"] { color:inherit; } } /*** 5.2: Audible Media ***/ @media aural { /*deprecated*/ * { /*pause-before:0; pause-after:0; cue-before:none; cue-after:none; play-during:auto;*/ } html { play-during:none; } body { voice-family:male; /*speak:normal; speak-punctuation:none; speak-numeral:continuous; volume:medium; speech-rate:medium; pitch:medium; pitch-range:50; stress:50; richness:50; azimuth:center; elevation:level;*/ } th, td { /*speak-header:once;*/ } small { volume:soft; } } @media speech { * { /*voice-duration:; phonemes:; pause-before:; pause-after:; cue-before:none; cue-after:none; rest-before:; rest-after:; mark-before:none; mark-after:none;*/ } body { voice-family:male; /*voice-volume:medium; voice-balance:center; speak:normal; voice-rate:; voice-pitch:medium; voice-pitch-range:; voice-stress:moderate;*/ } small { voice-volume:soft; } } @media audio { }
Revision: 15174
Updated Code
at December 10, 2009 16:22 by wizard04
Updated Code
/**************************************************************************************************/ /*This stylesheet was created for HTML 4.01 using CSS 3 (and older) /*Tested on Windows versions of Firefox 1.5-3.0, IE 6-7, Safari 3.2, Opera 9.2-9.6, and K-Meleon 1.5 /* /*I've put helpful classes into a separate stylesheet. PLEASE CUSTOMIZE THAT STYLESHEET AS NOTED! /*IE-specific stylesheets include fixes or fallbacks for both of these stylesheets, so comment out relevant rules /* if you won't be using the classes. /* /*Because of too many browser inconsistencies, I have: /*- left the styling of form elements up to the browser (for the most part). /*- not set the outline property on anything (e.g., `:focus`). /* /*Elements included: /* Obsolete: /* app, bgsound, blink, comment, listing, marquee, multicol, nobr, plaintext, sound, spacer, wbr, xmp /* Deprecated: /* applet, basefont, center, dir, font, isindex, menu, s, strike, u /* Non-standard: /* embed, noembed /* Standard: /* a, abbr, acronym, address, area, b, base, bdo, big, blockquote, body, br, button, caption, cite, /* code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, /* head, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, meta, noframes, noscript, /* object, ol, optgroup, option, p, param, pre, q, samp, script, select, small, span, strong, style, sub, sup, /* table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, ul, var /* /*1.0: The Basics /*2.0: Block-Level Elements /* 2.1: Headers /* 2.2: Lists /* 2.3: Tables /*3.0: Inline Elements /* 3.1: Hyperlinks /*4.0: Forms /* 4.1: Buttons /* 4.2: Text Inputs /* 4.3: Choices /*5.0: Media-Specific /* 5.1: Paged Media /* 5.2: Audible Media /**************************************************************************************************/ /***********************/ /*** 1.0: The Basics ***/ /***********************/ bgsound, comment, sound { display:none; } listing, xmp { white-space:pre; } app, blink, listing, marquee, multicol, nobr, plaintext, spacer, wbr, xmp, applet, center, dir, font, menu, s, strike, u, embed, noembed, a, abbr, acronym, address, b, big, blockquote, body, br, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, label, legend, li, map, noframes, noscript, object, ol, optgroup, option, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var { margin:0; padding:0; border:0 solid #000; font-style:inherit; font-weight:inherit; font-size:inherit; text-decoration:inherit; background-color:transparent; color:inherit; line-height:1.25; font-family:inherit; text-align:inherit; vertical-align:baseline; } html { background-color:#FFF; } body { padding:8px; font-family:sans-serif; font-size:95%; /*since sans-serif seems bigger*/ color:#000; font-style:normal; font-weight:normal; text-decoration:none; text-align:left; } /*********************************/ /*** 2.0: Block-Level Elements ***/ /*********************************/ p, ul, ol, dl, pre { margin:1em 0; } p:first-child, blockquote:first-child, ul:first-child, ol:first-child, dl:first-child, pre:first-child { margin-top:0; } p:last-child, blockquote:last-child, ul:last-child, ol:last-child, dl:last-child, pre:last-child { margin-bottom:0; } pre { font-family:"Envy Code R", "Courier New", Courier, monospace; } blockquote { margin:1em 1.25em; quotes:none; } blockquote:before, blockquote:after { content:""; } blockquote::before, blockquote::after { content:""; } address { font-style:normal; } center { text-align:center; } /*** 2.1: Headers ***/ h1, h2, h3, h4, h5, h6 { margin:1em 0; font-weight:bold; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; } h1 { font-size:2em; margin-bottom:0.5em; } h2 { font-size:1.7em; margin-bottom:0.59em; } h3 { font-size:1.4em; margin-bottom:0.71em; } h4, h5, h6 { font-size:1em; } hr { margin:0.5em 0; /*no way to get rid of the margin in IE, so I'll include it for consistency*/ border-width:2px; padding-top:1px; border-style:solid; border-color:#EAEAEA #BBB #676767 #EAEAEA; background-color:#BBB; color:#BBB; /*for IE*/ } /*** 2.2: Lists ***/ ul { list-style-type:disc; } ul ul { list-style-type:circle; } ul ul ul { list-style-type:square; } ul, ol, dir { padding-left:1.25em; list-style-position:outside; } ol { padding-left:2em; } menu { list-style-type:none; } dt { margin-top:0.5em; } dt:first-child { margin-top:0; } dd { margin-left:1.25em; } /*** 2.3: Tables ***/ table { border-collapse:collapse; border-spacing:0; } caption { caption-side:top; text-align:center; } td { vertical-align:top; } /****************************/ /*** 3.0: Inline Elements ***/ /****************************/ em, i, cite, var, dfn, ins { font-style:italic; } strong, b { font-weight:bold; } code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } code, var { background-color:#E6E6E6; } samp { color:#444; } del, strike, s { text-decoration:line-through; } u { text-decoration:underline; } /*Except for IE, browsers automatically add quotes around a `q` element; this removes them.*/ q:before, q:after { content:""; } q::before, q::after { content:""; } big { font-size:120%; } /*why isn't this deprecated?*/ small, sup, sub { font-size:80%; } sup { vertical-align:super; } sub { vertical-align:sub; } /*** 3.1: Hyperlinks ***/ a img { border:0; } /* Browsers seem to ignore the implicit pseudo-classes for anchors in terms of specificity; you can override them all at once with the selector `a` even though they are more specific. This is corrected when set explicity, as below. Note, however, that these will now be more tedious to override in other stylesheets. */ a:link { text-decoration:underline; color:#00E; } a:visited { color:#551A8B; } a:focus { } /*I don't use `a` elements as anchors (why would you?), so I won't make these selectors so specific*/ /*a:link:hover { } a:link:active { color:#F00; }*/ a:hover { } a:active { color:#F00; } /******************/ /*** 4.0: Forms ***/ /******************/ fieldset { display:block; padding:0.5em; border:1px solid #BBB; /*note: setting a border removes IE's curved corners*/ } legend { padding-left:3px; padding-right:3px; } isindex { display:block; position:static; } input, button, select { vertical-align:middle; } select[size], select[multiple], textarea { vertical-align:text-top; } input[type="file"] { } /*** 4.1: Buttons ***/ input[type="submit"], input[type="reset"], input[type="button"], button { } input[type="image"] { } /*** 4.2: Text Inputs ***/ input[type="text"], input[type="password"] { } textarea { overflow:auto; } /*** 4.3: Choices ***/ input[type="checkbox"], input[type="radio"] { } select { } optgroup { font-weight:bold; font-style:italic; } optgroup option { font-weight:normal; font-style:normal; padding-left:1em; } option { padding-right:0.75em; /*for Firefox*/ } option[disabled] { color:#999; } /***************************/ /*** 5.0: Media-Specific ***/ /***************************/ /*audio, aural (deprecated), braille, embossed, handheld, print, projection, screen, speech, tty, tv*/ @media aural, braille, embossed, speech, tty { /*img { content:attr(alt); } /*this is what's implied for relevant media, correct?*/ img[alt=""] { display:none; } img:not([alt]) { display:none; } } @media handheld { *, *:before, *:after { float:none !important; } *, *::before, *::after { float:none !important; } body { padding:2px; font-size:100%; } pre { white-space:pre-wrap; } blockquote { margin:1em 0 1em 1em; } dd { margin-left:1em; } h1 { margin-top:0.5em; } h2 { margin-top:0.59em; } h3 { margin-top:0.71em; } ul, ol { padding-left:0; list-style-position:inside; } img { max-width:100%; } } @media tv { } /*** 5.1: Paged Media ***/ @media embossed, print, projection, tv { * { page-break-before:auto; page-break-inside:auto; page-break-after:auto; } p, blockquote, li, dd, pre, h1, h2, h3, h4, h5, h6 { orphans:2; widows:2; } h1, h2, h3, h4, h5, h6 { page-break-after:avoid; } dt { page-break-after:avoid; } dd { page-break-before:avoid; } table, address, a { page-break-inside:avoid; } } @media embossed, print { body { padding:0; } a { text-decoration:none; } /*consider making sure it is still distinguishable on a B&W printer or to a color-blind user*/ } @media print { html { background-color:transparent; } body { font-size:11pt; font-family:"Times New Roman", Times, serif; } pre, code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } a:visited { color:#00E; } a[href^="#"] { color:inherit; } } /*** 5.2: Audible Media ***/ @media aural { /*deprecated*/ * { /*pause-before:0; pause-after:0; cue-before:none; cue-after:none; play-during:auto;*/ } html { play-during:none; } body { voice-family:male; /*speak:normal; speak-punctuation:none; speak-numeral:continuous; volume:medium; speech-rate:medium; pitch:medium; pitch-range:50; stress:50; richness:50; azimuth:center; elevation:level;*/ } th, td { /*speak-header:once;*/ } small { volume:soft; } } @media speech { * { /*voice-duration:; phonemes:; pause-before:; pause-after:; cue-before:none; cue-after:none; rest-before:; rest-after:; mark-before:none; mark-after:none;*/ } body { voice-family:male; /*voice-volume:medium; voice-balance:center; speak:normal; voice-rate:; voice-pitch:medium; voice-pitch-range:; voice-stress:moderate;*/ } small { voice-volume:soft; } } @media audio { }
Revision: 15173
Updated Code
at August 26, 2009 16:26 by wizard04
Updated Code
/**************************************************************************************************/ /*This stylesheet was created for HTML 4.01 using CSS 3 (and older) /*Tested on Windows versions of Firefox 1.5-3.0, IE 6-7, Safari 3.2, Opera 9.2-9.6, and K-Meleon 1.5 /* /*I've put helpful classes into a separate stylesheet. PLEASE CUSTOMIZE THAT STYLESHEET AS NOTED! /*IE-specific stylesheets include fixes or fallbacks for both of these stylesheets, so comment out relevant rules /* if you won't be using the classes. /* /*Because of too many browser inconsistencies, I have: /*- left the styling of form elements up to the browser (for the most part). /*- not set the outline property on anything (e.g., `:focus`). /* /*Elements included: /* Obsolete: /* app, bgsound, blink, comment, listing, marquee, multicol, nobr, plaintext, sound, spacer, wbr, xmp /* Deprecated: /* applet, basefont, center, dir, font, isindex, menu, s, strike, u /* Non-standard: /* embed, noembed /* Standard: /* a, abbr, acronym, address, area, b, base, bdo, big, blockquote, body, br, button, caption, cite, /* code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, /* head, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, meta, noframes, noscript, /* object, ol, optgroup, option, p, param, pre, q, samp, script, select, small, span, strong, style, sub, sup, /* table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, ul, var /* /*1.0: The Basics /*2.0: Block-Level Elements /* 2.1: Headers /* 2.2: Lists /* 2.3: Tables /*3.0: Inline Elements /* 3.1: Hyperlinks /*4.0: Forms /* 4.1: Buttons /* 4.2: Text Inputs /* 4.3: Choices /*5.0: Media-Specific /* 5.1: Paged Media /* 5.2: Audible Media /**************************************************************************************************/ /***********************/ /*** 1.0: The Basics ***/ /***********************/ bgsound, comment, sound { display:none; } listing, xmp { white-space:pre; } app, blink, listing, marquee, multicol, nobr, plaintext, spacer, wbr, xmp, applet, center, dir, font, menu, s, strike, u, embed, noembed, a, abbr, acronym, address, b, big, blockquote, body, br, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, label, legend, li, map, noframes, noscript, object, ol, optgroup, option, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var { margin:0; padding:0; border:0 solid #000; font-style:inherit; font-weight:inherit; text-decoration:inherit; background-color:transparent; color:inherit; line-height:1.25; font-family:inherit; text-align:inherit; vertical-align:baseline; } html { background-color:#FFF; } body { padding:8px; font-family:sans-serif; font-size:95%; /*since sans-serif seems bigger*/ color:#000; font-style:normal; font-weight:normal; text-decoration:none; text-align:left; } /*********************************/ /*** 2.0: Block-Level Elements ***/ /*********************************/ p, ul, ol, dl, pre { margin:1em 0; } p:first-child, blockquote:first-child, ul:first-child, ol:first-child, dl:first-child, pre:first-child { margin-top:0; } p:last-child, blockquote:last-child, ul:last-child, ol:last-child, dl:last-child, pre:last-child { margin-bottom:0; } pre { font-family:"Envy Code R", "Courier New", Courier, monospace; } blockquote { margin:1em 1.25em; quotes:none; } blockquote:before, blockquote:after { content:""; } blockquote::before, blockquote::after { content:""; } address { font-style:normal; } center { text-align:center; } /*** 2.1: Headers ***/ h1, h2, h3, h4, h5, h6 { margin:1em 0; font-weight:bold; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; } h1 { font-size:2em; margin-bottom:0.5em; } h2 { font-size:1.7em; margin-bottom:0.59em; } h3 { font-size:1.4em; margin-bottom:0.71em; } h4, h5, h6 { font-size:1em; } hr { margin:0.5em 0; /*no way to get rid of the margin in IE, so I'll include it for consistency*/ border-width:2px; padding-top:1px; border-style:solid; border-color:#EAEAEA #BBB #676767 #EAEAEA; background-color:#BBB; color:#BBB; /*for IE*/ } /*** 2.2: Lists ***/ ul { list-style-type:disc; } ul ul { list-style-type:circle; } ul ul ul { list-style-type:square; } ul, ol, dir { padding-left:1.25em; list-style-position:outside; } ol { padding-left:2em; } menu { list-style-type:none; } dt { margin-top:0.5em; } dt:first-child { margin-top:0; } dd { margin-left:1.25em; } /*** 2.3: Tables ***/ table { border-collapse:collapse; border-spacing:0; } caption { caption-side:top; text-align:center; } td { vertical-align:top; } /****************************/ /*** 3.0: Inline Elements ***/ /****************************/ em, i, cite, var, dfn, ins { font-style:italic; } strong, b { font-weight:bold; } code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } code, var { background-color:#E6E6E6; } samp { color:#444; } del, strike, s { text-decoration:line-through; } u { text-decoration:underline; } /*Except for IE, browsers automatically add quotes around a `q` element; this removes them.*/ q:before, q:after { content:""; } q::before, q::after { content:""; } sup { vertical-align:super; } sub { vertical-align:sub; } /*** 3.1: Hyperlinks ***/ a img { border:0; } /* Browsers seem to ignore the implicit pseudo-classes for anchors in terms of specificity; you can override them all at once with the selector `a` even though they are more specific. This is corrected when set explicity, as below. Note, however, that these will now be more tedious to override in other stylesheets. */ a:link { text-decoration:underline; color:#00E; } a:visited { color:#551A8B; } a:focus { } /*I don't use `a` elements as anchors (why would you?), so I won't make these selectors so specific*/ /*a:link:hover { } a:link:active { color:#F00; }*/ a:hover { } a:active { color:#F00; } /******************/ /*** 4.0: Forms ***/ /******************/ fieldset { display:block; padding:0.5em; border:1px solid #BBB; /*note: setting a border removes IE's curved corners*/ } legend { padding-left:3px; padding-right:3px; } isindex { display:block; position:static; } input, button, select { vertical-align:middle; } select[size], select[multiple] { vertical-align:text-top; } textarea { vertical-align:text-top; } option { padding-right:0.75em; } /*for Firefox*/ input[type="file"] { } /*** 4.1: Buttons ***/ input[type="submit"], input[type="reset"], input[type="button"], button { } input[type="image"] { } /*** 4.2: Text Inputs ***/ input[type="text"], input[type="password"] { } textarea { } /*** 4.3: Choices ***/ input[type="checkbox"], input[type="radio"] { } select { } /***************************/ /*** 5.0: Media-Specific ***/ /***************************/ /*audio, aural (deprecated), braille, embossed, handheld, print, projection, screen, speech, tty, tv*/ @media aural, braille, embossed, speech, tty { /*img { content:attr(alt); } /*this is what's implied for relevant media, correct?*/ img[alt=""] { display:none; } img:not([alt]) { display:none; } } @media handheld { *, *:before, *:after { float:none !important; } *, *::before, *::after { float:none !important; } body { padding:2px; font-size:100%; } pre { white-space:pre-wrap; } blockquote { margin:1em 0 1em 1em; } dd { margin-left:1em; } h1 { margin-top:0.5em; } h2 { margin-top:0.59em; } h3 { margin-top:0.71em; } ul, ol { padding-left:0; list-style-position:inside; } img { max-width:100%; } } @media tv { } /*** 5.1: Paged Media ***/ @media embossed, print, projection, tv { * { page-break-before:auto; page-break-inside:auto; page-break-after:auto; } p, blockquote, li, dd, pre, h1, h2, h3, h4, h5, h6 { orphans:2; widows:2; } h1, h2, h3, h4, h5, h6 { page-break-after:avoid; } dt { page-break-after:avoid; } dd { page-break-before:avoid; } table, address, a { page-break-inside:avoid; } } @media embossed, print { body { padding:0; } a { text-decoration:none; } /*consider making sure it is still distinguishable on a B&W printer or to a color-blind user*/ } @media print { html { background-color:transparent; } body { font-size:11pt; font-family:"Times New Roman", Times, serif; } pre, code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } a:visited { color:#00E; } a[href^="#"] { color:inherit; } } /*** 5.2: Audible Media ***/ @media aural { /*deprecated*/ * { /*pause-before:0; pause-after:0; cue-before:none; cue-after:none; play-during:auto;*/ } html { play-during:none; } body { voice-family:male; /*speak:normal; speak-punctuation:none; speak-numeral:continuous; volume:medium; speech-rate:medium; pitch:medium; pitch-range:50; stress:50; richness:50; azimuth:center; elevation:level;*/ } th, td { /*speak-header:once;*/ } } @media speech { * { /*voice-duration:; phonemes:; pause-before:; pause-after:; cue-before:none; cue-after:none; rest-before:; rest-after:; mark-before:none; mark-after:none;*/ } body { voice-family:male; /*voice-volume:medium; voice-balance:center; speak:normal; voice-rate:; voice-pitch:medium; voice-pitch-range:; voice-stress:moderate;*/ } } @media audio { }
Revision: 15172
Updated Code
at June 28, 2009 16:56 by wizard04
Updated Code
/**************************************************************************************************/ /*This stylesheet was created for HTML 4.01 using CSS 3 (and older) /*Tested on Windows versions of Firefox 1.5-3.0, IE 6-7, Safari 3.2, Opera 9.2-9.6, and K-Meleon 1.5 /* /*I've put helpful classes into a separate stylesheet. PLEASE CUSTOMIZE THAT STYLESHEET AS NOTED! /*IE-specific stylesheets include fixes or fallbacks for both of these stylesheets, so comment out relevant rules /* if you won't be using the classes. /* /*Because of too many browser inconsistencies, I have: /*- left the styling of form elements up to the browser (for the most part). /*- not set the outline property on anything (e.g., `:focus`). /* /*Elements included: /* Obsolete: /* app, bgsound, blink, comment, listing, marquee, multicol, nobr, plaintext, sound, spacer, wbr, xmp /* Deprecated: /* applet, basefont, center, dir, font, isindex, menu, s, strike, u /* Non-standard: /* embed, noembed /* Standard: /* a, abbr, acronym, address, area, b, base, bdo, big, blockquote, body, br, button, caption, cite, /* code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, /* head, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, meta, noframes, noscript, /* object, ol, optgroup, option, p, param, pre, q, samp, script, select, small, span, strong, style, sub, sup, /* table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, ul, var /* /*1.0: The Basics /*2.0: Block-Level Elements /* 2.1: Headers /* 2.2: Lists /* 2.3: Tables /*3.0: Inline Elements /* 3.1: Hyperlinks /*4.0: Forms /* 4.1: Buttons /* 4.2: Text Inputs /* 4.3: Choices /*5.0: Media-Specific /* 5.1: Paged Media /* 5.2: Audible Media /**************************************************************************************************/ /***********************/ /*** 1.0: The Basics ***/ /***********************/ bgsound, comment, sound { display:none; } listing, xmp { white-space:pre; } app, blink, listing, marquee, multicol, nobr, plaintext, spacer, wbr, xmp, applet, center, dir, font, menu, s, strike, u, embed, noembed, a, abbr, acronym, address, b, big, blockquote, body, br, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, label, legend, li, map, noframes, noscript, object, ol, optgroup, option, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var { margin:0; padding:0; border:0 solid #000; font-style:inherit; font-weight:inherit; text-decoration:inherit; background-color:transparent; color:inherit; line-height:1.25; font-family:inherit; text-align:inherit; vertical-align:baseline; } html { background-color:#FFF; } body { padding:8px; font-family:sans-serif; font-size:95%; /*since sans-serif seems bigger*/ color:#000; font-style:normal; font-weight:normal; text-decoration:none; text-align:left; } /*********************************/ /*** 2.0: Block-Level Elements ***/ /*********************************/ p, ul, ol, dl, pre { margin:1em 0; } p:first-child, blockquote:first-child, ul:first-child, ol:first-child, dl:first-child, pre:first-child { margin-top:0; } p:last-child, blockquote:last-child, ul:last-child, ol:last-child, dl:last-child, pre:last-child { margin-bottom:0; } pre { font-family:"Envy Code R", "Courier New", Courier, monospace; } blockquote { margin:1em 1.25em; quotes:none; } blockquote:before, blockquote:after { content:""; } blockquote::before, blockquote::after { content:""; } address { font-style:normal; } center { text-align:center; } /*** 2.1: Headers ***/ h1, h2, h3, h4, h5, h6 { margin:1em 0; font-weight:bold; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; } h1 { font-size:2em; margin-bottom:0.5em; } h2 { font-size:1.7em; margin-bottom:0.59em; } h3 { font-size:1.4em; margin-bottom:0.71em; } h4, h5, h6 { font-size:1em; } hr { margin:0.5em 0; /*no way to get rid of the margin in IE, so I'll include it for consistency*/ border-width:2px; padding-top:1px; border-style:solid; border-color:#EAEAEA #BBB #676767 #EAEAEA; background-color:#BBB; color:#BBB; /*for IE*/ } /*** 2.2: Lists ***/ ul { list-style-type:disc; } ul ul { list-style-type:circle; } ul ul ul { list-style-type:square; } ul, ol, dir { padding-left:1.25em; list-style-position:outside; } ol { padding-left:2em; } menu { list-style-type:none; } dt { margin-top:0.5em; } dt:first-child { margin-top:0; } dd { margin-left:1.25em; } /*** 2.3: Tables ***/ table { border-collapse:collapse; border-spacing:0; } caption { caption-side:top; text-align:center; } td { vertical-align:top; } /****************************/ /*** 3.0: Inline Elements ***/ /****************************/ em, i, cite, var, dfn, ins { font-style:italic; } strong, b { font-weight:bold; } code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } code, var { background-color:#E6E6E6; } samp { color:#444; } del, strike, s { text-decoration:line-through; } u { text-decoration:underline; } /*Except for IE, browsers automatically add quotes around a `q` element; this removes them.*/ q:before, q:after { content:""; } q::before, q::after { content:""; } sup { vertical-align:super; } sub { vertical-align:sub; } /*** 3.1: Hyperlinks ***/ a img { border:0; } /* Browsers seem to ignore the implicit pseudo-classes for anchors in terms of specificity; you can override them all at once with the selector `a` even though they are more specific. This is corrected when set explicity, as below. Note, however, that these will now be more tedious to override in other stylesheets. */ a:link { text-decoration:underline; color:#00E; } a:visited { color:#551A8B; } a:focus { } /*I don't use `a` elements as anchors (why would you?), so I won't make these selectors so specific*/ /*a:link:hover { } a:link:active { color:#F00; }*/ a:hover { } a:active { color:#F00; } /******************/ /*** 4.0: Forms ***/ /******************/ fieldset { padding:0.5em; border:1px solid #BBB; /*note: setting a border removes IE's curved corners*/ } isindex { display:block; position:static; } input, button, select { vertical-align:middle; } select[size], select[multiple] { vertical-align:text-top; } textarea { vertical-align:text-top; } option { padding-right:0.75em; } /*for Firefox*/ input[type="file"] { } /*** 4.1: Buttons ***/ input[type="submit"], input[type="reset"], input[type="button"], button { } input[type="image"] { } /*** 4.2: Text Inputs ***/ input[type="text"], input[type="password"] { } textarea { } /*** 4.3: Choices ***/ input[type="checkbox"], input[type="radio"] { } select { } /***************************/ /*** 5.0: Media-Specific ***/ /***************************/ /*audio, aural (deprecated), braille, embossed, handheld, print, projection, screen, speech, tty, tv*/ @media aural, braille, embossed, speech, tty { /*img { content:attr(alt); } /*this is what's implied for relevant media, correct?*/ img[alt=""] { display:none; } img:not([alt]) { display:none; } } @media handheld { *, *:before, *:after { float:none !important; } *, *::before, *::after { float:none !important; } body { padding:2px; font-size:100%; } pre { white-space:pre-wrap; } blockquote { margin:1em 0 1em 1em; } dd { margin-left:1em; } h1 { margin-top:0.5em; } h2 { margin-top:0.59em; } h3 { margin-top:0.71em; } ul, ol { padding-left:0; list-style-position:inside; } img { max-width:100%; } } @media tv { } /*** 5.1: Paged Media ***/ @media embossed, print, projection, tv { * { page-break-before:auto; page-break-inside:auto; page-break-after:auto; } p, blockquote, li, dd, pre, h1, h2, h3, h4, h5, h6 { orphans:2; widows:2; } h1, h2, h3, h4, h5, h6 { page-break-after:avoid; } dt { page-break-after:avoid; } dd { page-break-before:avoid; } table, address, a { page-break-inside:avoid; } } @media embossed, print { body { padding:0; } a { text-decoration:none; } /*consider making sure it is still distinguishable on a B&W printer or to a color-blind user*/ } @media print { html { background-color:transparent; } body { font-size:11pt; font-family:"Times New Roman", Times, serif; } pre, code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } a:visited { color:#00E; } a[href^="#"] { color:inherit; } } /*** 5.2: Audible Media ***/ @media aural { /*deprecated*/ * { /*pause-before:0; pause-after:0; cue-before:none; cue-after:none; play-during:auto;*/ } html { play-during:none; } body { voice-family:male; /*speak:normal; speak-punctuation:none; speak-numeral:continuous; volume:medium; speech-rate:medium; pitch:medium; pitch-range:50; stress:50; richness:50; azimuth:center; elevation:level;*/ } th, td { /*speak-header:once;*/ } } @media speech { * { /*voice-duration:; phonemes:; pause-before:; pause-after:; cue-before:none; cue-after:none; rest-before:; rest-after:; mark-before:none; mark-after:none;*/ } body { voice-family:male; /*voice-volume:medium; voice-balance:center; speak:normal; voice-rate:; voice-pitch:medium; voice-pitch-range:; voice-stress:moderate;*/ } } @media audio { }
Revision: 15171
Updated Code
at June 28, 2009 16:15 by wizard04
Updated Code
/**************************************************************************************************/ /*This stylesheet was created for HTML 4.01 using CSS 3 (and older) /*Tested on Windows versions of Firefox 1.5-3.0, IE 6-7, Safari 3.2, Opera 9.2-9.6, and K-Meleon 1.5 /* /*I've put helpful classes into a separate stylesheet. PLEASE CUSTOMIZE THAT STYLESHEET AS NOTED! /*IE-specific stylesheets include fixes or fallbacks for both of these stylesheets, so comment out relevant rules /* if you won't be using the classes. /* /*Because of too many browser inconsistencies, I have: /*- left the styling of form elements up to the browser (for the most part). /*- not set the outline property on anything (e.g., `:focus`). /* /*Elements included: /* Obsolete: /* app, bgsound, blink, comment, listing, marquee, multicol, nobr, plaintext, sound, spacer, wbr, xmp /* Deprecated: /* applet, basefont, center, dir, font, isindex, menu, s, strike, u /* Non-standard: /* embed, noembed /* Standard: /* a, abbr, acronym, address, area, b, base, bdo, big, blockquote, body, br, button, caption, cite, /* code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, /* head, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, meta, noframes, noscript, /* object, ol, optgroup, option, p, param, pre, q, samp, script, select, small, span, strong, style, sub, sup, /* table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, ul, var /* /*1.0: The Basics /*2.0: Block-Level Elements /* 2.1: Headers /* 2.2: Lists /* 2.3: Tables /*3.0: Inline Elements /* 3.1: Hyperlinks /*4.0: Forms /* 4.1: Buttons /* 4.2: Text Inputs /* 4.3: Choices /*5.0: Media-Specific /* 5.1: Paged Media /* 5.2: Audible Media /**************************************************************************************************/ /***********************/ /*** 1.0: The Basics ***/ /***********************/ bgsound, comment, sound { display:none; } listing, xmp { white-space:pre; } app, blink, listing, marquee, multicol, nobr, plaintext, spacer, wbr, xmp, applet, center, dir, font, menu, s, strike, u, embed, noembed, a, abbr, acronym, address, b, big, blockquote, body, br, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, label, legend, li, map, noframes, noscript, object, ol, optgroup, option, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var { margin:0; padding:0; border:0 solid #000; font-style:inherit; font-weight:inherit; text-decoration:inherit; background-color:transparent; color:inherit; line-height:1.25; font-family:inherit; text-align:inherit; vertical-align:baseline; } html { background-color:#FFF; } body { padding:8px; font-family:sans-serif; font-size:95%; /*since sans-serif seems bigger*/ color:#000; font-style:normal; font-weight:normal; text-decoration:none; text-align:left; } /*********************************/ /*** 2.0: Block-Level Elements ***/ /*********************************/ p, ul, ol, dl, pre { margin:1em 0; } p:first-child, blockquote:first-child, ul:first-child, ol:first-child, dl:first-child, pre:first-child { margin-top:0; } p:last-child, blockquote:last-child, ul:last-child, ol:last-child, dl:last-child, pre:last-child { margin-bottom:0; } pre { font-family:"Envy Code R", "Courier New", Courier, monospace; } blockquote { margin:1em 1.25em; quotes:none; } blockquote:before, blockquote:after { content:""; } blockquote::before, blockquote::after { content:""; } address { font-style:normal; } center { text-align:center; } /*** 2.1: Headers ***/ h1, h2, h3, h4, h5, h6 { margin:1em 0; font-weight:bold; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; } h1 { font-size:2em; margin-bottom:0.5em; } h2 { font-size:1.7em; margin-bottom:0.59em; } h3 { font-size:1.4em; margin-bottom:0.71em; } h4, h5, h6 { font-size:1em; } hr { margin:0.5em 0; /*no way to get rid of the margin in IE, so I'll include it for consistency*/ border-width:2px; padding-top:1px; border-style:solid; border-color:#EAEAEA #BBB #676767 #EAEAEA; background-color:#BBB; color:#BBB; /*for IE*/ } /*** 2.2: Lists ***/ ul { list-style-type:disc; } ul ul { list-style-type:circle; } ul ul ul { list-style-type:square; } ul, ol, dir { padding-left:1.25em; list-style-position:outside; } ol { padding-left:2em; } menu { list-style-type:none; } dt { margin-top:0.5em; } dt:first-child { margin-top:0; } dd { margin-left:1.25em; } /*** 2.3: Tables ***/ table { border-collapse:collapse; border-spacing:0; } caption { caption-side:top; text-align:center; } td { vertical-align:top; } /****************************/ /*** 3.0: Inline Elements ***/ /****************************/ em, i, cite, var, dfn, ins { font-style:italic; } strong, b { font-weight:bold; } code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } code, var { background-color:#E6E6E6; } samp { color:#444; } del, strike, s { text-decoration:line-through; } u { text-decoration:underline; } /*only works in Firefox, K-Meleon, and Opera 9.5+*/ /*abbr[title]:not([title=""]), acronym[title]:not([title=""]) { border-bottom:1px dotted currentColor; }*/ /*Except for IE, browsers automatically add quotes around a `q` element; this removes them.*/ q:before, q:after { content:""; } q::before, q::after { content:""; } sup { vertical-align:super; } sub { vertical-align:sub; } /*** 3.1: Hyperlinks ***/ a img { border:0; } /* Browsers seem to ignore the implicit pseudo-classes for anchors in terms of specificity; you can override them all at once with the selector `a` even though they are more specific. This is corrected when set explicity, as below. Note, however, that these will now be more tedious to override in other stylesheets. */ a:link { text-decoration:underline; color:#00E; } a:visited { color:#551A8B; } a:focus { } /*I don't use `a` elements as anchors (why would you?), so I won't make these selectors so specific*/ /*a:link:hover { } a:link:active { color:#F00; }*/ a:hover { } a:active { color:#F00; } /******************/ /*** 4.0: Forms ***/ /******************/ fieldset { padding:0.5em; border:1px solid #BBB; /*note: setting a border removes IE's curved corners*/ } isindex { display:block; position:static; } input, button, select { vertical-align:middle; } select[size], select[multiple] { vertical-align:text-top; } textarea { vertical-align:text-top; } option { padding-right:0.75em; } /*for Firefox*/ input[type="file"] { } /*** 4.1: Buttons ***/ input[type="submit"], input[type="reset"], input[type="button"], button { } input[type="image"] { } /*** 4.2: Text Inputs ***/ input[type="text"], input[type="password"] { } textarea { } /*** 4.3: Choices ***/ input[type="checkbox"], input[type="radio"] { } select { } /***************************/ /*** 5.0: Media-Specific ***/ /***************************/ /*audio, aural (deprecated), braille, embossed, handheld, print, projection, screen, speech, tty, tv*/ @media aural, braille, embossed, speech, tty { /*img { content:attr(alt); } /*this is what's implied for relevant media, correct?*/ img[alt=""] { display:none; } img:not([alt]) { display:none; } } @media handheld { *, *:before, *:after { float:none !important; } *, *::before, *::after { float:none !important; } body { padding:2px; font-size:100%; } pre { white-space:pre-wrap; } blockquote { margin:1em 0 1em 1em; } dd { margin-left:1em; } h1 { margin-top:0.5em; } h2 { margin-top:0.59em; } h3 { margin-top:0.71em; } ul, ol { padding-left:0; list-style-position:inside; } img { max-width:100%; } } @media tv { } /*** 5.1: Paged Media ***/ @media embossed, print, projection, tv { * { page-break-before:auto; page-break-inside:auto; page-break-after:auto; } p, blockquote, li, dd, pre, h1, h2, h3, h4, h5, h6 { orphans:2; widows:2; } h1, h2, h3, h4, h5, h6 { page-break-after:avoid; } dt { page-break-after:avoid; } dd { page-break-before:avoid; } table, address, a { page-break-inside:avoid; } } @media embossed, print { body { padding:0; } a { text-decoration:none; } /*consider making sure it is still distinguishable on a B&W printer or to a color-blind user*/ } @media print { html { background-color:transparent; } body { font-size:11pt; font-family:"Times New Roman", Times, serif; } pre, code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } a:visited { color:#00E; } a[href^="#"] { color:inherit; } } /*** 5.2: Audible Media ***/ @media aural { /*deprecated*/ * { /*pause-before:0; pause-after:0; cue-before:none; cue-after:none; play-during:auto;*/ } html { play-during:none; } body { voice-family:male; /*speak:normal; speak-punctuation:none; speak-numeral:continuous; volume:medium; speech-rate:medium; pitch:medium; pitch-range:50; stress:50; richness:50; azimuth:center; elevation:level;*/ } th, td { /*speak-header:once;*/ } } @media speech { * { /*voice-duration:; phonemes:; pause-before:; pause-after:; cue-before:none; cue-after:none; rest-before:; rest-after:; mark-before:none; mark-after:none;*/ } body { voice-family:male; /*voice-volume:medium; voice-balance:center; speak:normal; voice-rate:; voice-pitch:medium; voice-pitch-range:; voice-stress:moderate;*/ } } @media audio { }
Revision: 15170
Updated Code
at June 28, 2009 16:14 by wizard04
Updated Code
/**************************************************************************************************/ /*This stylesheet was created for HTML 4.01 using CSS 3 (and older) /*Tested on Windows versions of Firefox 1.5-3.0, IE 6-7, Safari 3.2, Opera 9.2-9.6, and K-Meleon 1.5 /* /*I've put helpful classes into a separate stylesheet. PLEASE CUSTOMIZE THAT STYLESHEET AS NOTED! /*IE-specific stylesheets include fixes or fallbacks for both of these stylesheets, so comment out relevant rules /* if you won't be using the classes. /* /*Because of too many browser inconsistencies, I have: /*- left the styling of form elements up to the browser (for the most part). /*- not set the outline property on anything (e.g., `:focus`). /* /*Elements included: /* Obsolete: /* app, bgsound, blink, comment, listing, marquee, multicol, nobr, plaintext, sound, spacer, wbr, xmp /* Deprecated: /* applet, basefont, center, dir, font, isindex, menu, s, strike, u /* Non-standard: /* embed, noembed /* Standard: /* a, abbr, acronym, address, area, b, base, bdo, big, blockquote, body, br, button, caption, cite, /* code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, /* head, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, meta, noframes, noscript, /* object, ol, optgroup, option, p, param, pre, q, samp, script, select, small, span, strong, style, sub, sup, /* table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, ul, var /* /*1.0: The Basics /*2.0: Block-Level Elements /* 2.1: Headers /* 2.2: Lists /* 2.3: Tables /*3.0: Inline Elements /* 3.1: Hyperlinks /*4.0: Forms /* 4.1: Buttons /* 4.2: Text Inputs /* 4.3: Choices /*5.0: Media-Specific /* 5.1: Paged Media /* 5.2: Audible Media /**************************************************************************************************/ /***********************/ /*** 1.0: The Basics ***/ /***********************/ bgsound, comment, sound { display:none; } listing, xmp { white-space:pre; } app, blink, listing, marquee, multicol, nobr, plaintext, spacer, wbr, xmp, applet, center, dir, font, menu, s, strike, u, embed, noembed, a, abbr, acronym, address, b, big, blockquote, body, br, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, label, legend, li, map, noframes, noscript, object, ol, optgroup, option, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var { margin:0; padding:0; border:0 solid #000; font-style:inherit; font-weight:inherit; text-decoration:inherit; background-color:transparent; color:inherit; line-height:1.25; font-family:inherit; text-align:inherit; vertical-align:baseline; } html { background-color:#FFF; } body { padding:8px; font-family:sans-serif; font-size:95%; /*since sans-serif seems bigger*/ color:#000; font-style:normal; font-weight:normal; text-decoration:none; text-align:left; } /*********************************/ /*** 2.0: Block-Level Elements ***/ /*********************************/ p, ul, ol, dl, pre { margin:1em 0; } p:first-child, blockquote:first-child, ul:first-child, ol:first-child, dl:first-child, pre:first-child { margin-top:0; } p:last-child, blockquote:last-child, ul:last-child, ol:last-child, dl:last-child, pre:last-child { margin-bottom:0; } pre { font-family:"Envy Code R", "Courier New", Courier, monospace; } blockquote { margin:1em 1.25em; quotes:none; } blockquote:before, blockquote:after { content:""; } blockquote::before, blockquote::after { content:""; } address { font-style:normal; } center { text-align:center; } /*** 2.1: Headers ***/ h1, h2, h3, h4, h5, h6 { margin:1em 0; font-weight:bold; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; } h1 { font-size:2em; margin-bottom:0.5em; } h2 { font-size:1.7em; margin-bottom:0.59em; } h3 { font-size:1.4em; margin-bottom:0.71em; } h4, h5, h6 { font-size:1em; } hr { margin:0.5em 0; /*no way to get rid of the margin in IE, so I'll include it for consistency*/ border-width:2px; padding-top:1px; border-style:solid; border-color:#EAEAEA #BBB #676767 #EAEAEA; background-color:#BBB; color:#BBB; /*for IE*/ } /*** 2.2: Lists ***/ ul { list-style-type:disc; } ul ul { list-style-type:circle; } ul ul ul { list-style-type:square; } ul, ol, dir { padding-left:1.25em; list-style-position:outside; } ol { padding-left:2em; } menu { list-style-type:none; } dt { margin-top:0.5em; } dt:first-child { margin-top:0; } dd { margin-left:1.25em; } /*** 2.3: Tables ***/ table { border-collapse:collapse; border-spacing:0; } caption { caption-side:top; text-align:center; } td { vertical-align:top; } /****************************/ /*** 3.0: Inline Elements ***/ /****************************/ em, i, cite, var, dfn { font-style:italic; } strong, b { font-weight:bold; } code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } code, var { background-color:#E6E6E6; } samp { color:#444; } del, strike, s { text-decoration:line-through; } u { text-decoration:underline; } ins { font-style:italic; } /*only works in Firefox, K-Meleon, and Opera 9.5+*/ /*abbr[title]:not([title=""]), acronym[title]:not([title=""]) { border-bottom:1px dotted currentColor; }*/ /*Except for IE, browsers automatically add quotes around a `q` element; this removes them.*/ q:before, q:after { content:""; } q::before, q::after { content:""; } sup { vertical-align:super; } sub { vertical-align:sub; } /*** 3.1: Hyperlinks ***/ a img { border:0; } /* Browsers seem to ignore the implicit pseudo-classes for anchors in terms of specificity; you can override them all at once with the selector `a` even though they are more specific. This is corrected when set explicity, as below. Note, however, that these will now be more tedious to override in other stylesheets. */ a:link { text-decoration:underline; color:#00E; } a:visited { color:#551A8B; } a:focus { } /*I don't use `a` elements as anchors (why would you?), so I won't make these selectors so specific*/ /*a:link:hover { } a:link:active { color:#F00; }*/ a:hover { } a:active { color:#F00; } /******************/ /*** 4.0: Forms ***/ /******************/ fieldset { padding:0.5em; border:1px solid #BBB; /*note: setting a border removes IE's curved corners*/ } isindex { display:block; position:static; } input, button, select { vertical-align:middle; } select[size], select[multiple] { vertical-align:text-top; } textarea { vertical-align:text-top; } option { padding-right:0.75em; } /*for Firefox*/ input[type="file"] { } /*** 4.1: Buttons ***/ input[type="submit"], input[type="reset"], input[type="button"], button { } input[type="image"] { } /*** 4.2: Text Inputs ***/ input[type="text"], input[type="password"] { } textarea { } /*** 4.3: Choices ***/ input[type="checkbox"], input[type="radio"] { } select { } /***************************/ /*** 5.0: Media-Specific ***/ /***************************/ /*audio, aural (deprecated), braille, embossed, handheld, print, projection, screen, speech, tty, tv*/ @media aural, braille, embossed, speech, tty { /*img { content:attr(alt); } /*this is what's implied for relevant media, correct?*/ img[alt=""] { display:none; } img:not([alt]) { display:none; } } @media handheld { *, *:before, *:after { float:none !important; } *, *::before, *::after { float:none !important; } body { padding:2px; font-size:100%; } pre { white-space:pre-wrap; } blockquote { margin:1em 0 1em 1em; } dd { margin-left:1em; } h1 { margin-top:0.5em; } h2 { margin-top:0.59em; } h3 { margin-top:0.71em; } ul, ol { padding-left:0; list-style-position:inside; } img { max-width:100%; } } @media tv { } /*** 5.1: Paged Media ***/ @media embossed, print, projection, tv { * { page-break-before:auto; page-break-inside:auto; page-break-after:auto; } p, blockquote, li, dd, pre, h1, h2, h3, h4, h5, h6 { orphans:2; widows:2; } h1, h2, h3, h4, h5, h6 { page-break-after:avoid; } dt { page-break-after:avoid; } dd { page-break-before:avoid; } table, address, a { page-break-inside:avoid; } } @media embossed, print { body { padding:0; } a { text-decoration:none; } /*consider making sure it is still distinguishable on a B&W printer or to a color-blind user*/ } @media print { html { background-color:transparent; } body { font-size:11pt; font-family:"Times New Roman", Times, serif; } pre, code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } a:visited { color:#00E; } a[href^="#"] { color:inherit; } } /*** 5.2: Audible Media ***/ @media aural { /*deprecated*/ * { /*pause-before:0; pause-after:0; cue-before:none; cue-after:none; play-during:auto;*/ } html { play-during:none; } body { voice-family:male; /*speak:normal; speak-punctuation:none; speak-numeral:continuous; volume:medium; speech-rate:medium; pitch:medium; pitch-range:50; stress:50; richness:50; azimuth:center; elevation:level;*/ } th, td { /*speak-header:once;*/ } } @media speech { * { /*voice-duration:; phonemes:; pause-before:; pause-after:; cue-before:none; cue-after:none; rest-before:; rest-after:; mark-before:none; mark-after:none;*/ } body { voice-family:male; /*voice-volume:medium; voice-balance:center; speak:normal; voice-rate:; voice-pitch:medium; voice-pitch-range:; voice-stress:moderate;*/ } } @media audio { }
Revision: 15169
Updated Code
at June 28, 2009 16:04 by wizard04
Updated Code
/**************************************************************************************************/ /*This stylesheet was created for HTML 4.01 using CSS 3 (and older) /*Tested on Windows versions of Firefox 1.5-3.0, IE 6-7, Safari 3.2, Opera 9.2-9.6, and K-Meleon 1.5 /* /*I've put helpful classes into a separate stylesheet. PLEASE CUSTOMIZE THAT STYLESHEET AS NOTED! /*IE-specific stylesheets include fixes or fallbacks for both of these stylesheets, so comment out relevant rules /* if you won't be using the classes. /* /*Because of too many browser inconsistencies, I have: /*- left the styling of form elements up to the browser (for the most part). /*- not set the outline property on anything (e.g., `:focus`). /* /*Elements included: /* Obsolete: /* app, bgsound, blink, comment, listing, marquee, multicol, nobr, plaintext, sound, spacer, wbr, xmp /* Deprecated: /* applet, basefont, center, dir, font, isindex, menu, s, strike, u /* Non-standard: /* embed, noembed /* Standard: /* a, abbr, acronym, address, area, b, base, bdo, big, blockquote, body, br, button, caption, cite, /* code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, /* head, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, meta, noframes, noscript, /* object, ol, optgroup, option, p, param, pre, q, samp, script, select, small, span, strong, style, sub, sup, /* table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, ul, var /* /*1.0: The Basics /*2.0: Block-Level Elements /* 2.1: Headers /* 2.2: Lists /* 2.3: Tables /*3.0: Inline Elements /* 3.1: Hyperlinks /*4.0: Forms /* 4.1: Buttons /* 4.2: Text Inputs /* 4.3: Choices /*5.0: Media-Specific /* 5.1: Paged Media /* 5.2: Audible Media /**************************************************************************************************/ /***********************/ /*** 1.0: The Basics ***/ /***********************/ bgsound, comment, sound { display:none; } listing, xmp { white-space:pre; } app, blink, listing, marquee, multicol, nobr, plaintext, spacer, wbr, xmp, applet, center, dir, font, menu, s, strike, u, embed, noembed, a, abbr, acronym, address, b, big, blockquote, body, br, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, label, legend, li, map, noframes, noscript, object, ol, optgroup, option, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var { margin:0; padding:0; border:0 solid #000; font-style:inherit; font-weight:inherit; text-decoration:inherit; background-color:transparent; color:inherit; line-height:1.25; font-family:inherit; text-align:inherit; vertical-align:baseline; } html { background-color:#FFF; } body { padding:8px; font-family:sans-serif; font-size:95%; /*since sans-serif seems bigger*/ color:#000; font-style:normal; font-weight:normal; text-decoration:none; text-align:left; } /*********************************/ /*** 2.0: Block-Level Elements ***/ /*********************************/ p, ul, ol, dl, pre { margin:1em 0; } p:first-child, blockquote:first-child, ul:first-child, ol:first-child, dl:first-child, pre:first-child { margin-top:0; } p:last-child, blockquote:last-child, ul:last-child, ol:last-child, dl:last-child, pre:last-child { margin-bottom:0; } pre { font-family:"Envy Code R", "Courier New", Courier, monospace; } blockquote { margin:1em 1.25em; quotes:none; } blockquote:before, blockquote:after { content:""; } blockquote::before, blockquote::after { content:""; } address { font-style:normal; } center { text-align:center; } /*** 2.1: Headers ***/ h1, h2, h3, h4, h5, h6 { margin:1em 0; font-weight:bold; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; } h1 { font-size:2em; margin-bottom:0.5em; } h2 { font-size:1.7em; margin-bottom:0.59em; } h3 { font-size:1.4em; margin-bottom:0.71em; } h4, h5, h6 { font-size:1em; } hr { margin:0.5em 0; /*no way to get rid of the margin in IE, so I'll include it for consistency*/ border-width:2px; padding-top:1px; border-style:solid; border-color:#EAEAEA #BBB #676767 #EAEAEA; background-color:#BBB; color:#BBB; /*for IE*/ } /*** 2.2: Lists ***/ ul { list-style-type:disc; } ul ul { list-style-type:circle; } ul ul ul { list-style-type:square; } ul, ol, dir { padding-left:1.25em; list-style-position:outside; } ol { padding-left:2em; } menu { list-style-type:none; } dt { margin-top:0.5em; } dt:first-child { margin-top:0; } dd { margin-left:1.25em; } /*** 2.3: Tables ***/ table { border-collapse:collapse; border-spacing:0; } caption { caption-side:top; text-align:center; } td { vertical-align:top; } /****************************/ /*** 3.0: Inline Elements ***/ /****************************/ em, i, cite, var, dfn { font-style:italic; } strong, b { font-weight:bold; } code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } code, var { background-color:#E6E6E6; } samp { color:#444; } del, strike, s { text-decoration:line-through; } u { text-decoration:underline; } ins { font-style:italic; } /*only works in Firefox, K-Meleon, and Opera 9.5+*/ /*abbr[title]:not([title=""]), acronym[title]:not([title=""]) { border-bottom:1px dotted currentColor; }*/ /*Except for IE, browsers automatically add quotes around a `q` element; this removes them.*/ q:before, q:after { content:""; } q::before, q::after { content:""; } sup { vertical-align:super; } sub { vertical-align:sub; } /*** 3.1: Hyperlinks ***/ a img { border:0; } /* Browsers seem to ignore the implicit pseudo-classes for anchors in terms of specificity; you can override them all at once with the selector `a` even though they are more specific. This is corrected when set explicity, as below. Note, however, that these will now be more tedious to override in other stylesheets. */ a:link { text-decoration:underline; color:#00E; } a:visited { color:#551A8B; } a:focus { } /*I don't use `a` elements as anchors (why would you?), so I won't make these selectors so specific*/ /*a:link:hover { } a:link:active { color:#F00; }*/ a:hover { } a:active { color:#F00; } /******************/ /*** 4.0: Forms ***/ /******************/ fieldset { padding:0.5em; border:1px solid #BBB; /*note: setting a border removes IE's curved corners*/ } isindex { display:block; position:static; } input, button, select { vertical-align:middle; } select[size], select[multiple] { vertical-align:text-top; } textarea { vertical-align:text-top; } option { padding-right:0.75em; } /*for Firefox*/ input[type="file"] { } /*** 4.1: Buttons ***/ input[type="submit"], input[type="reset"], input[type="button"], button { } input[type="image"] { } /*** 4.2: Text Inputs ***/ input[type="text"], input[type="password"] { } textarea { } /*** 4.3: Choices ***/ input[type="checkbox"], input[type="radio"] { } select { } /***************************/ /*** 5.0: Media-Specific ***/ /***************************/ /*audio, aural (deprecated), braille, embossed, handheld, print, projection, screen, speech, tty, tv*/ @media aural, braille, embossed, speech, tty { /*img { content:attr(alt); } /*this is what's implied for relevant media, correct?*/ img[alt=""] { display:none; } img:not([alt]) { display:none; } } @media handheld { *, *:before, *:after { float:none !important; } *, *::before, *::after { float:none !important; } body { padding:2px; font-size:100%; } pre { white-space:pre-wrap; } blockquote { margin:1em 0 1em 1em; } dd { margin-left:1em; } h1 { margin-top:0.5em; } h2 { margin-top:0.59em; } h3 { margin-top:0.71em; } ul, ol { padding-left:0; list-style-position:inside; } img { max-width:100%; } } @media tv { } /*** 5.1: Paged Media ***/ @media embossed, print, projection, tv { * { page-break-before:auto; page-break-inside:auto; page-break-after:auto; } p, blockquote, li, dd, pre, h1, h2, h3, h4, h5, h6 { orphans:2; widows:2; } h1, h2, h3, h4, h5, h6 { page-break-after:avoid; } dt { page-break-after:avoid; } dd { page-break-before:avoid; } table, address, a { page-break-inside:avoid; } } @media embossed, print { body { padding:0; } a { text-decoration:none; } /*consider making sure it is still distinguishable on a B&W printer or to a color-blind user*/ } @media print { html { background-color:transparent; } body { font-size:11pt; font-family:"Times New Roman", Times, serif; } pre, code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } a:visited { color:#00E; } a[href^="#"] { color:inherit; } } /*** 5.2: Audible Media ***/ @media aural { /*deprecated*/ * { /*pause-before:0; pause-after:0; cue-before:none; cue-after:none; play-during:auto;*/ } html { play-during:none; } body { voice-family:male; /*speak:normal; speak-punctuation:none; speak-numeral:continuous; volume:medium; speech-rate:medium; pitch:medium; pitch-range:50; stress:50; richness:50; azimuth:center; elevation:level;*/ } th, td { /*speak-header:once;*/ } } @media speech { * { /*voice-duration:; phonemes:; pause-before:; pause-after:; cue-before:none; cue-after:none; rest-before:; rest-after:; mark-before:none; mark-after:none;*/ } body { voice-family:male; /*voice-volume:medium; voice-balance:center; speak:normal; voice-rate:; voice-pitch:medium; voice-pitch-range:; voice-stress:moderate;*/ } } @media audio { }
Revision: 15168
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at June 26, 2009 15:20 by wizard04
Initial Code
/**************************************************************************************************/ /*This stylesheet was created for HTML 4.01 using CSS 3 (and older) /*Tested on Windows versions of Firefox 1.5-3.0, IE 6-7, Safari 3.2, Opera 9.2-9.6, and K-Meleon 1.5 /* /*I've put helpful classes into a separate stylesheet. PLEASE CUSTOMIZE THAT STYLESHEET AS NOTED! /*IE-specific stylesheets include fixes or fallbacks for both of these stylesheets, so comment out relevant rules /* if you won't be using the classes. /* /*Because of too many browser inconsistencies, I have: /*- left the styling of form elements up to the browser (for the most part). /*- not set the outline property on anything (e.g., `:focus`). /* /*Elements included: /* Obsolete: /* app, bgsound, blink, comment, listing, marquee, multicol, nobr, plaintext, sound, spacer, wbr, xmp /* Deprecated: /* applet, basefont, center, dir, font, isindex, menu, s, strike, u /* Non-standard: /* embed, noembed /* Standard: /* a, abbr, acronym, address, area, b, base, bdo, big, blockquote, body, br, button, caption, cite, /* code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, /* head, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, meta, noframes, noscript, /* object, ol, optgroup, option, p, param, pre, q, samp, script, select, small, span, strong, style, sub, sup, /* table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, ul, var /* /*1.0: The Basics /*2.0: Block-Level Elements /* 2.1: Headers /* 2.2: Lists /* 2.3: Tables /*3.0: Inline Elements /* 3.1: Hyperlinks /*4.0: Forms /* 4.1: Buttons /* 4.2: Text Inputs /* 4.3: Choices /*5.0: Media-Specific /* 5.1: Paged Media /* 5.2: Audible Media /**************************************************************************************************/ /***********************/ /*** 1.0: The Basics ***/ /***********************/ bgsound, comment, sound { display:none; } listing, xmp { white-space:pre; } app, blink, listing, marquee, multicol, nobr, plaintext, spacer, wbr, xmp, applet, center, dir, font, menu, s, strike, u, embed, noembed, a, abbr, acronym, address, b, big, blockquote, body, br, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, frame, frameset, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, ins, kbd, label, legend, li, map, noframes, noscript, object, ol, optgroup, option, p, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, ul, var { margin:0; padding:0; border:0 solid #000; font-style:inherit; font-weight:inherit; text-decoration:inherit; background-color:transparent; color:inherit; line-height:1.25; font-family:inherit; text-align:inherit; vertical-align:baseline; } html { background-color:#FFF; } body { padding:8px; font-family:sans-serif; font-size:95%; /*since sans-serif seems bigger*/ color:#000; font-style:normal; font-weight:normal; text-decoration:none; text-align:left; } /*********************************/ /*** 2.0: Block-Level Elements ***/ /*********************************/ p, ul, ol, dl, pre { margin:1em 0; } p:first-child, blockquote:first-child, ul:first-child, ol:first-child, dl:first-child, pre:first-child { margin-top:0; } p:last-child, blockquote:last-child, ul:last-child, ol:last-child, dl:last-child, pre:last-child { margin-bottom:0; } pre { font-family:"Envy Code R", "Courier New", Courier, monospace; } blockquote { margin:1em 1.25em; quotes:none; } blockquote:before, blockquote:after { content:""; } blockquote::before, blockquote::after { content:""; } address { font-style:normal; } center { text-align:center; } /*** 2.1: Headers ***/ h1, h2, h3, h4, h5, h6 { margin:1em 0; font-weight:bold; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top:0; } h1 { font-size:2em; margin-bottom:0.5em; } h2 { font-size:1.7em; margin-bottom:0.59em; } h3 { font-size:1.4em; margin-bottom:0.71em; } h4, h5, h6 { font-size:1em; } hr { margin:0.5em 0; /*no way to get rid of the margin in IE, so I'll include it for consistency*/ border-width:2px; padding-top:1px; border-style:solid; border-color:#EAEAEA #BBB #676767 #EAEAEA; background-color:#BBB; color:#BBB; /*for IE*/ } /*** 2.2: Lists ***/ ul { list-style-type:disc; } ul ul { list-style-type:circle; } ul ul ul { list-style-type:square; } ul, ol, dir { padding-left:1.25em; list-style-position:outside; } ol { padding-left:2em; } menu { list-style-type:none; } dt { margin-top:0.5em; } dt:first-child { margin-top:0; } dd { margin-left:1.25em; } /*** 2.3: Tables ***/ table { border-collapse:collapse; border-spacing:0; } caption { caption-side:top; text-align:center; } td { vertical-align:top; } /****************************/ /*** 3.0: Inline Elements ***/ /****************************/ em, i, cite, var, dfn { font-style:italic; } strong, b { font-weight:bold; } code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } code, var { background-color:#E6E6E6; } samp { color:#444; } del, strike, s { text-decoration:line-through; } u { text-decoration:underline; } ins { text-decoration:none; font-style:italic; } abbr, acronym { text-decoration:none; border:0; } /*Except for IE, browsers automatically add quotes around a `q` element; this removes them.*/ q:before, q:after { content:""; } q::before, q::after { content:""; } sup { vertical-align:super; } sub { vertical-align:sub; } /*** 3.1: Hyperlinks ***/ a img { border:0; } /* Browsers seem to ignore the implicit pseudo-classes for anchors in terms of specificity; you can override them all at once with the selector `a` even though they are more specific. This is corrected when set explicity, as below. Note, however, that these will now be more tedious to override in other stylesheets. */ a:link { text-decoration:underline; color:#00E; } a:visited { color:#551A8B; } a:focus { } /*I don't use `a` elements as anchors (why would you?), so I won't make these selectors so specific*/ /*a:link:hover { } a:link:active { color:#F00; }*/ a:hover { } a:active { color:#F00; } /******************/ /*** 4.0: Forms ***/ /******************/ fieldset { padding:0.5em; border:1px solid #BBB; /*note: setting a border removes IE's curved corners*/ } isindex { display:block; position:static; } input, button, select { vertical-align:middle; } select[size], select[multiple] { vertical-align:text-top; } textarea { vertical-align:text-top; } option { padding-right:0.75em; } /*for Firefox*/ input[type="file"] { } /*** 4.1: Buttons ***/ input[type="submit"], input[type="reset"], input[type="button"], button { } input[type="image"] { } /*** 4.2: Text Inputs ***/ input[type="text"], input[type="password"] { } textarea { } /*** 4.3: Choices ***/ input[type="checkbox"], input[type="radio"] { } select { } /***************************/ /*** 5.0: Media-Specific ***/ /***************************/ /*audio, aural (deprecated), braille, embossed, handheld, print, projection, screen, speech, tty, tv*/ @media aural, braille, embossed, speech, tty { /*img { content:attr(alt); } /*this is what's implied for relevant media, correct?*/ img[alt=""] { display:none; } img:not([alt]) { display:none; } } @media handheld { *, *:before, *:after { float:none !important; } *, *::before, *::after { float:none !important; } body { padding:2px; font-size:100%; } pre { white-space:pre-wrap; } blockquote { margin:1em 0 1em 1em; } dd { margin-left:1em; } h1 { margin-top:0.5em; } h2 { margin-top:0.59em; } h3 { margin-top:0.71em; } ul, ol { padding-left:0; list-style-position:inside; } img { max-width:100%; } } @media tv { } /*** 5.1: Paged Media ***/ @media embossed, print, projection, tv { * { page-break-before:auto; page-break-inside:auto; page-break-after:auto; } p, blockquote, li, dd, pre, h1, h2, h3, h4, h5, h6 { orphans:2; widows:2; } h1, h2, h3, h4, h5, h6 { page-break-after:avoid; } dt { page-break-after:avoid; } dd { page-break-before:avoid; } table, address, a { page-break-inside:avoid; } } @media embossed, print { body { padding:0; } a { text-decoration:none; } /*consider making sure it is still distinguishable on a B&W printer or to a color-blind user*/ } @media print { html { background-color:transparent; } body { font-size:11pt; } body, body * { font-family:"Times New Roman", Times, serif; } pre, code, kbd, samp, tt, var { font-family:"Envy Code R", "Courier New", Courier, monospace; } a:visited { color:#00E; } a[href^="#"] { color:inherit; } } /*** 5.2: Audible Media ***/ @media aural { /*deprecated*/ * { /*pause-before:0; pause-after:0; cue-before:none; cue-after:none; play-during:auto;*/ } html { play-during:none; } body { voice-family:male; /*speak:normal; speak-punctuation:none; speak-numeral:continuous; volume:medium; speech-rate:medium; pitch:medium; pitch-range:50; stress:50; richness:50; azimuth:center; elevation:level;*/ } th, td { /*speak-header:once;*/ } } @media speech { * { /*voice-duration:; phonemes:; pause-before:; pause-after:; cue-before:none; cue-after:none; rest-before:; rest-after:; mark-before:none; mark-after:none;*/ } body { voice-family:male; /*voice-volume:medium; voice-balance:center; speak:normal; voice-rate:; voice-pitch:medium; voice-pitch-range:; voice-stress:moderate;*/ } } @media audio { }
Initial URL
Initial Description
A very thorough CSS reset stylesheet I created for HTML 4.01 using CSS 3 (and older). [Part II](http://snipplr.com/view/16354/"DzR Master Stylesheet (Part II, Classes)") [Part III](http://snipplr.com/view/16355/ "DzR Master Stylesheet (Part III, IE)")
Initial Title
DzR Master Stylesheet (Part I, Reset)
Initial Tags
css
Initial Language
CSS