Skip to content

Instantly share code, notes, and snippets.

@jimjeffers
Created February 17, 2012 23:26
Show Gist options
  • Save jimjeffers/1856111 to your computer and use it in GitHub Desktop.
Save jimjeffers/1856111 to your computer and use it in GitHub Desktop.
CSS3 Gradient Pixel/Percentage Mix-n-Match Example
/**
* CSS3 Gradient Pixel/Percentage Mix-n-Match Example
*/
background: #f06;
background: linear-gradient(left, #f00 10px, #444 20px, #3465a4 21px, #203388 10rem, #204a87 100%);
min-height:100%;
background: #426fa9;
background-image: -webkit-linear-gradient(left, #f00 10px, #444 20px, #3465a4 21px, #203388 10rem, #204a87 100%);
background-image: -moz-linear-gradient(left, #f00 10px, #444 20px, #3465a4 21px, #203388 10rem, #204a87 100%);
background-image: -o-linear-gradient(left, #f00 10px, #444 20px, #3465a4 21px, #203388 10rem, #204a87 100%);
background-image: -ms-linear-gradient(left, #f00 10px, #444 20px, #3465a4 21px, #203388 10rem, #204a87 100%);
background-image: linear-gradient(left, #f00 10px, #444 20px, #3465a4 21px, #203388 10rem, #204a87 100%);
<!-- content to be placed inside <body>…</body> -->
{"view":"split","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment