Basic CSS

* basics
#id = ID (mnemonic: I'd like some *hash*)
.class = class (mnemonic: polka *dots* are classic and classy)

* margin direction:
top right bottom left
(clockwise, starting from top)

* comments
/* this is a comment */
// this is not a comment!

* debugging
border: 2px solid red !important
or
display: none !important

* specifying elements:

html:
<ul id="list">
<li>
<div class="d1">one</div>
<div class="d2">two</div>
<div class="d3">three</div>
</li>
</ul>

css:
#list li div.d1 { //css }

--------------------------
http://robertnyman.com/2007/10/18/dont-over-specify-your-css-code/

/* Instead of this: */
div#container p.pre-amble{
margin-top: 1em;
}

/* Write it like this: */
.pre-amble{
margin-top: 1em;
}

/* Or like this: */
#container .pre-amble{
margin-top: 1em;
}

/* Instead of this: */
div#container div#header ul#navigation li{
float: left;
}

/* Write it like this: */
#navigation li{
float: left;
}

/* Or like this: */
#header #navigation li{
float: left;
}