Style Sheets: Developing a 'Core Cascading Style Sheet'
This project involves the development a 'Core Cascading Style Sheet' (Core CSS) that shares definitions and support for all the major browsers. As you will see in the example pages to follow, a Core CSS can provide a simpler approach to making style sheets more reliable for multiple environments.
These example pages linked below are provided primarily for illustrative purposes and include some displayed code in parts of the examples. Their purpose is for testing the rendering aspects for many of the various HyperText Markup Language (HTML) elements using Cascading Style Sheet (CSS) support. The support is meant to cover a variety of web browsers and Operating System environments while producing similar rendering aspects.
The Core CSS template used here additionally defines aspects for the printing of the document, and characteristics of how screen readers will read this page aloud. All of the Changes to Industry CSS Recommendations are explained on a separate page along with the reasons for those changes.
To illustrate just how difficult it is to develop a Universal Core CSS, even W3C has opted to using custom templates for each browser. This core CSS design works quite well with all browsers, provided an understanding of it's limitations are understood. These limitations are not that unreasonable either, merely requiring some knowledge of where things can go wrong. Most of the limitations of using the core CCS are explained in these pages.
Core CSS Template Implementation
The Core CSS template 'as-is' with comments is 16.8 kB in size, with all the comments removed it is 11.3 kB in size. Remember, the actual template that you will use can ultimately be larger or smaller than these sizes. This Core CSS uses little to no color definitions. Those defined are only the base necessities that are required to render a default page.
The size may seem large for an incomplete CSS, but you should remember that it is more than the basic CSS. It includes definitions for printing your web pages, creating rules for content grouping, and it includes a full set of definitions for screen reader browsers, useful for the visually impared.
The way we implement this Core CSS is it is always left in its original format, without changes. The actual design of the site is then provided with a secondary style sheet. In this manner the site is assured to render correctly and consistently with all browsers, with only the design components providing any variance.
Keeping the core separate also makes for a simpler design style sheet should any editing or modifications be necessary. This makes it much easier to adjust or repair the design elements since a major portion of CSS never needs touched.
