CSS: Gradient Button for IE9
@import "compass";
$txtColor: #7d7d7d;
$btnTop: #e5eff6;
$btnBottom: #A8C2D3;
$btnBorder: #b7cfdd;
.button, button {
display: inline-block;
cursor: pointer;
padding: 5px 7px;
border: 1px solid $btnBorder;
border-radius: 5px;
color: $txtColor;
font-weight: 700;
background: $btnTop;
text-shadow: 0 1px 0 #FFF;
@include box-shadow(
inset 0 0 15px rgba(#fff,0.3),
inset 0 -2em 3em -1.5em $btnBottom,
0 1px 3px 0 rgba(#000,0.3));
margin: 5em;
&:hover {
@include box-shadow(
inset 0 0 15px rgba(#fff,0.3),
0 1px 3px 0 rgba(#000,0.3));
color: darken($btnBottom,30%);
}
}
.button
hello!