Skip to content

Instantly share code, notes, and snippets.

@growdigital
Created December 21, 2012 16:31
Show Gist options
  • Save growdigital/4353855 to your computer and use it in GitHub Desktop.
Save growdigital/4353855 to your computer and use it in GitHub Desktop.
LESS basic vertical gradient
// Vertical gradient
/////////////////////
.vert_grad (@start-color, @end-color) {
background-color: @end-color;
background-repeat: repeat-x;
background-image: -khtml-gradient(linear, left top, left bottom, from(@start-color), to(@end-color)); /* Konqueror */
background-image: -moz-linear-gradient(@start-color, @end-color); /* FF 3.6+ */
background-image: -ms-linear-gradient(@start-color, @end-color); /* IE10 */
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @start-color), color-stop(100%, @end-color)); /* Safari 4+, Chrome 2+ */
background-image: -webkit-linear-gradient(@start-color, @end-color); /* Safari 5.1+, Chrome 10+ */
background-image: -o-linear-gradient(@start-color, @end-color); /* Opera 11.10 */
background-image: -ms-linear-gradient(top, @start-color 0%, @end-color 100%); /* IE10+ */
background-image: linear-gradient(@start-color, @end-color); /* the standard */
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment