CSS reset

There’s a bunch of different css-reset to use on your site, I’ve tried several of them but always comes back to use the YUI version.

<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.2r1/build/reset/reset-min.css">

CSS3, round corners

.round-all {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.round-top {
  -webkit-border-top-left-radius: 5px; 
  -webkit-border-top-right-radius: 5px; 
  -moz-border-radius-topleft: 5px; 
  -moz-border-radius-topright: 5px; 
  border-top-left-radius: 5px; 
  border-top-right-radius: 5px;
}
.round-bottom {
  -webkit-border-bottom-right-radius: 5px; 
  -webkit-border-bottom-left-radius: 5px; 
  -moz-border-radius-bottomright: 5px; 
  -moz-border-radius-bottomleft: 5px; 
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}
.round-left {
  -webkit-border-top-left-radius: 5px; 
  -webkit-border-bottom-left-radius: 5px; 
  -moz-border-radius-topleft: 5px; 
  -moz-border-radius-bottomleft: 5px; 
  border-top-left-radius: 5px; 
  border-bottom-left-radius: 5px;
}
.round-right {
  -webkit-border-top-right-radius: 5px; 
  -webkit-border-bottom-right-radius: 5px; 
  -moz-border-radius-topright: 5px; 
  -moz-border-radius-bottomright: 5px; 
  border-top-right-radius: 5px; 
  border-bottom-right-radius: 5px;
}

Debug css

Found a really handy way to debug my wireframes from snipplrhttp://snipplr.com/view/746/handy-css-debug-snippet/

* { outline: 2px dotted red }
* * { outline: 2px dotted green }
* * * { outline: 2px dotted orange }
* * * * { outline: 2px dotted blue }
* * * * * { outline: 1px solid red }
* * * * * * { outline: 1px solid green }
* * * * * * * { outline: 1px solid orange }
* * * * * * * * { outline: 1px solid blue }