Here are some CSS tricks I use.

Reset the style:

* { margin:0; padding:0; }
h1, h2, h3, h4, h5, h6 { line-height: 100%; margin: 0.15em 0 0 0; }
li { line-height: 133%; }
p { margin: 0.5em 0; }

Always have a scrollbar, at right-hand side (otherwise centered colums "move" when switching between pages which do or don't overflow the screen):

html {
        overflow: scrollbars-vertical;
        overflow: -moz-scrollbars-vertical;
        overflow: -webkit-scrollbars-vertical;
        overflow-y: scroll;
}

Style the quote tag <q></q>:

q:before { content: "« "; color:grey; }
q:after { content: " »"; color:grey; }

See also other quotation mark glyphs.

Other nice CSS tricks:

Resources:

  • http://youmightnotneedjs.com/

This page will be updated with more tricks in the future.