CodePen

HTML

            
              <a class="button" href="#">test</a>
            
          
!
via HTML Inspector

CSS

            
              		.chrome-gradient(@color: #FFF, @start: #e9e9e9, @stop: #fefefe) {
	  		background: @color;
	  		background: -webkit-gradient(linear, left bottom, left top, color-stop(0, @start),color-stop(1, @stop));
	  		background: -ms-linear-gradient(bottom, @start, @stop);
	  		background: -moz-linear-gradient(center bottom, @start 0%, @stop 100%);
	  		background: -o-linear-gradient(@stop, @start);
	  		filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start));
			}
	
		.chrome-gradient-hover(@color: #FFF, @start: #e4e4e4, @stop: #f9f9f9) {
	  		background: @color;
	  		background: -webkit-gradient(linear, left bottom, left top, color-stop(0, @start),color-stop(1, @stop));
	  		background: -ms-linear-gradient(bottom, @start, @stop);
	  		background: -moz-linear-gradient(center bottom, @start 0%, @stop 100%);
	  		background: -o-linear-gradient(@stop, @start);
	  		filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@stop,@start));
			}

a.button, a.button:visited {
	.chrome-gradient;
  padding:20px;
	}

a.button:hover {
	.chrome-gradient-hover;
	}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................