An Example CSS Framework

Attached Files

CSS_Framework.zip(5.8 KB)

A CSS framework is a set of pre-prepared style sheets that can be used as a starting point for any project. Using a framework allows you to skip all the tedious parts of getting the basics right and lets you start working on what makes your site different from the beginning.

There are numerous advantages to using a CSS framework, including cross browser compatibility, increased productivity and improved consistency between projects. The framework provided here is aimed at those developing sites using the SilverStripe CMS, but is just as useful for anyone developing a CSS based layout.

The files included are:

• test_page.html - Sample HTML 4.1 strict page for use testing and developing the CSS. This will later form the starting point for making your templates.
• layout.css - This is the core layout and contains all the wrappers, menus and page elements styling.
• typography.css - This contains all the content styles for elements such as fonts, links and headers.
• form.css - Contains all the styles for forms. This file is the same one as is included with the silverstripe blackcandy theme in v2.3.
• ie6.css - Holder for any future (inevitable!) Internet Explorer 6 fixes. Conditionally included into the template HTML file when the browser is IE6.
• ie7.css - As above but for the slightly improved yet still temperamental Internet Explorer 7.

 

About the Author