estelle

body {background: no-repeat black; min-height: 400px;
background-image: 
  	repeating-linear-gradient(135deg,
	    yellow 0,
		yellow 1px, 
		green 1px,
		green 9px,
		yellow 9px,
		yellow 10px,

estelle

/**
 * testing the image() for background image
 */


body {
     background-image: image(http://www.happywebbies.com/img/webbie-madness/trophy-winner.png);
}

estelle

/**
 * background-repeat issues
 */

background-image: -webkit-radial-gradient(50% 50%, circle closest-side, transparent 70%, #C7573A 70%,#C7573A 85%,transparent  85% );
background-size: 100px 100px;
background-repeat: round repeat;
background-position: 0 0, 20px 20px;
min-height:100%;

estelle

/**
 * Background-image rendering order
 */

background-image: -webkit-radial-gradient(50% 50%, circle closest-side, transparent 70%, #C7573A 70%,#C7573A 85%,transparent  85% );
background-size: 100px 100px;
background-repeat: no-repeat;
background-position: 0 0, 20px 20px;
min-height:100%;

estelle

/**
 * Background-image rendering order
 */

background-image: linear-gradient(#C7573A, #C7573A), linear-gradient(#BDD9D5,#BDD9D5);
background-size: 100px 100px;
background-repeat: no-repeat;
background-position: 0 0, 20px 20px;
min-height:100%;

estelle

/* WebKit FOUC when animation-play-state:paused→running */
/* that’s flash of unanimated content, or the element’s default state */ 

@keyframes runaway {
/* the flash goes to the previous keyframe */
  0% {transform: translate3d(5px,0,0); opacity: 1;}
  25% {transform: translate3d(80px,0,0); opacity: 1;}
  50% {transform: translate3d(155px,0,0); opacity: 1;}
  100% {transform: translate3d(305px,0,0); opacity: 1;}
}

estelle

var stopsopa = {
    pagehtml: document.getElementsByTagName("html")[0],
    pagebody: document.getElementsByTagName("body")[0],
    sopaText: "Stop SOPA",
    // change to whatever you want
    date: new Date(),
    blackout: function () {
        var pageAry = [stopsopa.pagehtml, stopsopa.pagebody],
            div = document.createElement("div"),
            text = document.createTextNode(stopsopa.sopaText),

estelle

/* leaverou / estelle test */
background-color:silver;
background-image: 
	radial-gradient(100% 150%, circle, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent),
	radial-gradient(0    150%, circle, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent),
	radial-gradient(50%  100%, circle, white 10%, silver 11%, silver 23%, white 24%, white 30%, silver 31%, silver 43%, white 44%, white 50%, silver 51%, silver 63%, white 64%, white 71%, transparent 71%, transparent),
	radial-gradient(100% 50%,  circle, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent),
	radial-gradient(0    50%,  circle, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent);
background-s

estelle

background-color:silver;
background-image: 
	radial-gradient(100% 150%, circle, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent),
	radial-gradient(0    150%, circle, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent),
	radial-gradient(50%  100%, circle, white 10%, silver 11%, silver 23%, white 24%, white 30%, silver 31%, silver 43%, white 44%, white 50%, silver 51%, silver 63%, white 64%, white 71%, transparent 71%, transparent),
	radial-gradient(100% 50%,  circle, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent),
	radial-gradient(0    50%,  circle, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent);
background-size:100px 50px;

estelle

<!-- Paste it in your address bar -->

data:text/html,<pre onkeyup="(function(d,t){d[t]('iframe')[0].contentDocument.body.innerHTML = d[t]('pre')[0].textContent;})(document,'getElementsByTagName')" style="width:100%;height:48%;white-space:pre-wrap;overflow:auto;" contenteditable></pre><iframe style="width:100%;height:48%">