In this section

Site navigation below

The Code Style site has evolved by gradual refinement and accumulation of features and content. This review is part of a fully backdated site log and archive that sheds light on when, why and how particular features were implemented.

This log is sometimes updated several times per week, sometimes with a long overdue backlog of items. Many log entries refer to the Code Style Java package that delivers the servlet services and utilities used to manage this site.

Subscribe to the news feed for this log: RSS news feed

Reverse chronology

28th October 2001

Compiled multiple references into a new Anchor Points: DOCTYPE interpretation section and added further anchors to the subsection on CSS2 media stylesheets. Also made various minor additions to Anchor Points: Javascript & DOM, extended the Javascript FAQ and applied standard dl markup.

Moved the .MenuBox selector for margin-right from CSStdLayoutCommon.css into the grouped selector for the wide margin in CSStdLayoutStrict.css:

/*
  Wide margin-right to float images
  and box-outs there.
*/
#Content P, #Content OL, #Content UL,
#Content DL, #Content PRE, .MenuBox{
  margin-right:     31%;
}
      

25th October 2001

Added a link to Anchor Points: Recommended books to the site Help & FAQ. Added the Mac font survey results and Font sampler and survey FAQ to the link element navigation for the Code Style font sampler subsection.

Added a to query parameter to the AnchorPoints servlet to work in form-based navigation systems as required.

23rd October 2001

Added the full CSS media monitor subsection to the What's new page.

22th October 2001

Added nested list items to standard sidebar for the CSS media monitor and Code Style font sampler subsections. Added a style rule to CSStdLayoutCommon.css to keep the nested list compact and explicitly reduced all margins on the #Sidebar selector to zero:

UL.Menu UL{
  margin-left:      1em;
  padding-left:     0;
}
/*
  Round cornered sidebar container.
*/
#Sidebar{
  float:            left;
  width:            22%;
  clear:            none;
  padding:          0;
  margin:           0;
  border:           none;
}
      

Gave all simple pre elements the same wide margin-right value as p, ul and ol, and added a new .Wide class to those with line lengths greater than 40 characters to allow a greater width:

/*
  Wide margin-right to float images
  and box-outs there.
*/
#Content P, #Content OL, #Content UL,
#Content DL, #Content PRE{
  margin-right:     31%;
}
/*
  Don't compound the margins for
  nested elements!
*/
#Content OL OL, #Content UL UL,
#Content OL P, #Content UL P,
#Content DD P, #Content DD OL,
#Content DD UL, #Content DD PRE,
#Content DD DL,
#Content .MenuBox UL,
#Content .MenuBox OL{
  margin-right:     0;
}
/*
  Longer preformatted lines take more
  width.
*/
#Content PRE.Wide,
#Content DL DD PRE.Wide{
  margin-right:     0;
}
      

Updated the generic meta keywords for the CSS media monitor subsection, ran a syntax check on all the test case media stylesheets and made various changes to the CSS2 media stylesheet glossary, CSS media monitor index CSS style guide and home page to publish the completed test suite.

21st October 2001

Changed various document headings, titles and captions throughout the CSS media monitor subsection to emphasise browser conformance over compatibility. Switched all browser conformance summary documents to use the standard page layout styles, CSStandard.css rather than the wide stylesheet, CSWide.css.

Introduced clearer column heading labels to the media stylesheet browser conformance tables to better indicate the combination of @import and @media rules. Also added a floating media guide boxout menu with links to each conformance table, as seen here, and applied a generic standfirst introduction to the test suite.

20th October 2001

Completed the CSS2 media conformance table content for unsupported media types in the tested browsers, aural, braille, embossed, handheld, tty and tv, via server side include. All test case results for these media types are equivalent. Added all conformance tables as appendices to the test suite link navigation and links back to the CSS media monitor section from each test case document.

Added margin-top: 2em; to the .MediaTable selector for extra spacing in the Netscape 4 stylesheet, CSStdLayoutNN4.css. Also added a new CAPTION STRONG selector for these tables to make the table numbers greater contrast black on white.

18th October 2001

Switched all offline versions of the CSS2 media stylesheet conformance summary pages to the standard layout style, changed all headings to emphasise conformance over compatibility and introduced clearer table heading text and formatting. Also corrected the test case 5 notes for Opera 3.62, which supports media dependent @import rules for media types.

Reduced font-size for the .SuperHeading class in the CSS media monitor browser conformance tables and made code within normal font-weight.

15th October 2001

Uploaded the stylesheets with the new 1:2:1 horizontal layout for sidebar, body content and right margin: CSStdLayoutStrict.css and CSStdLayoutCommon.css.

Abandoned 303 see other response for HTTP 1.1 user agents in AnchorPoints servlet as this was incorrectly being logged as 200 OK by JServ/Apache. Formerly as below, does redirect, doesn't log properly:

// Check if a HTTP 1.0 user agent
if(protocol.indexOf("1.0")>-1){
  res.sendRedirect(url);
}
else{// Use HTTP 1.1 status response
  res.setStatus(res.SC_SEE_OTHER);
  res.setHeader("Location",url);
}
      

13th October 2001

Created the first Mac font survey results page and added links to all relevant menus and index pages. Added an archival note to the abandoned CSStandardImport.css stylesheet because it is referred to throughout the site log archive.

11th October 2001

Minimised margin properties on the main content containers, #Sidebar and #Content and changed element widths to give a horizontal layout closer to a 1:2:1 proportion in the offline copies of CSStdLayoutStrict.css and CSStdLayoutCommon.css. Adjusted margin-right on all relevant selectors to position text within the central 50% of the screen and minimised margin-top and padding-top on the body element.

CSStdLayoutStrict.css

#Header P, #Header H1{
  margin-right:     24%;
  margin-bottom:    0;
}
#Content{
  float:            right;
  width:            75%;
  padding:          0% 0% 0% 1.4%;
  margin:           0;
}
/*
  Wide margin-right to float images
  and box-outs there.
*/
#Content P, #Content OL, #Content UL,
#Content DL{
  margin-right:     31%;
}
      

CSStdLayoutCommon.css

BODY{
  margin-top:       0;
  padding-top:      0;
}
      

10th October 2001

Completed the all media browser conformance page with all current test results, including a summary paragraph on the implications of the tests. Re-wrote the Internet Explorer 5.5 test case summary to explain the complexities of test case 2.

8th October 2001

Refined the wording of the table legend for the media stylesheet results tables to distinguish between conformance and compatibility. Completed the common standfirst text for this test suite with standard hyperlinks for the conformance tables, legend and abbreviations.

7th October 2001

Completed the set of browser test case files for the media stylesheet test pages and added these to all the test case documents via server side include and moved the outline of the expected behaviour in each case to the top of the page. Updated all test page menus to include fragment anchors to tie in to the new down-page navigation. Completed testing in Internet Explorer 5.5 and Opera 5.11.

The .Category class lost its text-align: right declaration in the recent re-organisation of stylesheets, so this is restored to CSStdLiveryCommon.css. Also added a new .C for compatible class for media stylesheet results tables.

TD.B, TD.C, TD.Y, TD.N, TD.NA, TD.W,
#Footbar, #Footer, .AlphaLinks,
.Caption, .ImgHeading,
.RadioData, .TestData, .SubHeading,
.SuperHeading{
  text-align:       center;
}
.C{
  color:            #000;
  background:       #FF0;
  font-weight:      bold;
}
      

Removed the margin-left declaration on the caption element in the CSWideImport.css stylesheet.

6th October 2001

Created a set of test case summaries to be included in the full suite of media stylesheet test pages for each of the browsers tested. Case summaries use a more generic, descriptive approach which notes the exceptional cases, with fragment anchors for each browser. Also created a generic down-page navigation for each browser, to view source and the test page menu.

1st October 2001

Completed the update of the Code Style CSS overview and updated the Windows font survey results page, including a new "typical Windows font profile" table listing the top 14 ranked fonts. Removed the Marlett symbol font from the Windows font sampler and results as it has not Unicode mapping and cannot not render symbols reliably in browsers. Simplified the opening section of the survey pages by removing the distracting "see also" links.

Updated the site home page and CSS style guide index pages to highlight new versions of these articles. Ran a link check and corrected a few bad links.

Previously on Code Style

These backdated pages record detailed changes to the Code Style Web site since July 2000, when development first got underway. Some pages may refer to documents or features that have since changed or are no longer part of the site, but the archive is checked to ensure there are no dead links.

Add this page to your chosen social bookmarking service

Style warning - please read

Home · CSS · Java · Javascript · HTML · Help · Log