LeaVerou

/**
 * Combined filters demo
 * Webkit-only at the moment (Chrome Canary or Webkit nightlies)
 */

img {
	transition: .5s -webkit-filter;
}

img:first-of-type {

LeaVerou

/**
 * Colorize black element with filters
 * Webkit-only at the moment (Chrome Canary or Webkit nightlies)
 */

body {
	background: pink;
}

div {

LeaVerou

/**
 * Elliptical gradient test
 */

background: #f06;
background: radial-gradient(closest-side, #f06 98%, gold 99%);
min-height:100%;

LeaVerou

/**
 * Transitioning visibility
 */

div {
	width: 100px; height: 100px;
	background: #f06;
	transition: 1s background, 1s visibility step-start;
} 

LeaVerou

/**
 * oli
 */

body { position: relative; margin: 50px; }

div {
	position: absolute;
	top: 0; left: 0;
	border: 40px solid black;

LeaVerou

/**
 * Angled Navigation?
 * to help @Chrisedmo
 */

nav li {
	list-style: none;
	float: left;
}

LeaVerou

/**
 * Learning CSS3
 * background-size, background-origin, outline
 */

html { 
	min-height:100%;
	background: url('http://leaverou.github.com/CSSS/img/rainbow-wood.jpg') bottom;
	background-size: cover;
}

LeaVerou

/**
 * Learning CSS3
 * Multiple backgrounds, basic linear gradients
 */

html {
	background: linear-gradient(black, #444);	
	background-color: #222;
	height: 100%;
}

LeaVerou

/**
 * Weird body sizing
 */

html, body { 
	min-height: 100%;
}

html {
	background: red;

LeaVerou

/**
 * Learning CSS3
 * Before background-size, background-origin, outline
 */

html { 
	min-height:100%;
	background: url('http://leaverou.github.com/CSSS/img/rainbow-wood.jpg');
}