CSS REFERENCE GUIDE

This is a collaborative page written by participants and organizers. The goals of this page is to create a best practices guide for referencing those often forgotten bits of CSS we should know quickly.

Maybe you forgot how to write the important rule, or maybe you need a quick reference to a css selector. Once this information is gathered we can then begin to create an HTML version that can be shared via github that is usable and helpful in our daily routines. All selectors must be implemented by all major browsers and may include vendor prefixes. 

CSS SELECTORS:

CSS 2.1 : W3 Status: Recommendation [ June 7, 2011 ]

Element Selectors : selects the html elements tag name

1. any html element ex.) p{ font-weight: bold; } -or- body { width: 100%; } 

Contextual Selectors :  determined by the elements context or it's containing element AKA the "parent"

1. ex. ) p strong { color: #000; } -or- body div#main { float: left; } 

Class Selectors :  selects element by its given class attribute name

1. p.myclassname {...} or  div.myclassname {...}

ID Selectors : selects element by its given id attribute name

1. p#myuniqueid or  #myuniqueid

Child Selectors : element(s) that are direct descendants or otherwise "children" to the containing parent element.

1. img[src] or  p > h1 {...}

Sibling Selectors : element must immediately follow the first element

1. h4 + p or  div + h1

Attribute Selectors : 

1. img[src] or  p[id="unique_id"]

CSS 3 :

CSS FORMATTING

CSS 2.1 : W3 Status: Recommendation [ June 7, 2011 ]

Font Sizing : 

1. font-size=12px or font-size=1em or font-size=100%

CSS 3 :