CSS Resources Index

1 Snippits and Examples
- 1.1 Local Examples
- 1.2 3rd Party Examples
2 Best Practices and Programming Style
- 2.1 Do's and Don'ts
3 Other Resources
- 3.1 Forms

Snippits and Examples

In no particular order, the following are a list of CSS snippits and modules that are developed for example and reuse. The approach taken in most cases should be modular, re-usable and extendable.

[edit]

Local Examples

css-buttons (www.chadlindstrom.ca)
css-dateboxes (www.chadlindstrom.ca)
css-fauxcolumns-backgrounds (www.chadlindstrom.ca)
css-fauxcolumns-borders (www.chadlindstrom.ca)
css-global-styles (www.chadlindstrom.ca)
css-image-frames (www.chadlindstrom.ca)
css-inline-floats (www.chadlindstrom.ca)
css-link-icons (www.chadlindstrom.ca)

[edit]

3rd Party Examples

Styling Code Boxes (www.dustindiaz.com)

[edit]

Best Practices and Programming Style

The following is a list of demonstrated modules, practices and styles that are considered 'best practices' and work well in multi-developer projects of all sizes.

css-programming-style (www.chadlindstrom.ca)
css-override-styles (www.chadlindstrom.ca)
css-global-styles (www.chadlindstrom.ca)
css-image-frames (www.chadlindstrom.ca)

[edit]

Do's and Don'ts

Do: use stylesheets for styles and layout; use semantic markup, classes and id's [1] [2] [3]; define a doctype, it helps shape how your browser renders and executes

Don't: use stylesheets for interaction/behaviour. Pseudo-classes are not meant to display menus. That's what the behaviour layer is for.; globally apply left or right margins or styles to textural elements, you will thank me later. Instead, use indent styles and apply to blocks of elements. This allows to align different/unique tags/elements on a page. More explanation why this is a don't

[edit]