Skip to content
Snippets Groups Projects
button.css 3.09 KiB
Newer Older
  • Learn to ignore specific revisions
  • button {
      font: 14px "Trebuchet MS";
      background-color: #222;
      background-image: -moz-linear-gradient(top, rgba(255,255,255,.25), rgba(255,255,255,.11));
      background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, rgba(255,255,255,.25)),color-stop(1, rgba(255,255,255,.11)));
      background-image: -webkit-linear-gradient(rgba(255,255,255,.25), rgba(255,255,255,.11));
      color: #fff;
      text-rendering: optimizeLegibility;
      text-shadow: 0 -1px 1px #222;
      padding: 3px 5px 3px 5px;
      border: 0;
      border-radius: 0;
      border-bottom: 1px solid #222;
      margin: 0;
      -moz-box-shadow: 0 1px 3px #999;
      -webkit-box-shadow: 0 1px 3px #999;
      box-shadow: 0 1px 3px #999;
    }
    
    button.first {
      border-top-left-radius: 5px;
      border-bottom-left-radius: 5px;
    }
    
    button.last {
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
    }
    
    button.active {
      background-color: rgb(65,102,133);
    }
    
    button:hover {
      background-color: steelblue;
    }
    
    input {
      font: 14px "Trebuchet MS";
      background-image: -moz-linear-gradient(top, rgba(255,255,255,.25), rgba(255,255,255,.11));
      background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, rgba(255,255,255,.25)),color-stop(1, rgba(255,255,255,.11)));
      background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,.1));
      color: #000;
      text-rendering: optimizeLegibility;
      padding: 3px 5px 3px 5px;
      border: 0;
      border-radius: 0;
      margin: 0;
      -moz-box-shadow: 0 1px 3px #999;
      -webkit-box-shadow: 0 1px 3px #999;
      box-shadow: 0 1px 3px #999;
    }
    
    textarea {
      font: 14px "Trebuchet MS";
      background-image: -moz-linear-gradient(top, rgba(255,255,255,.25), rgba(255,255,255,.11));
      background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, rgba(255,255,255,.25)),color-stop(1, rgba(255,255,255,.11)));
      background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,.1));
      color: #000;
      text-rendering: optimizeLegibility;
      padding: 3px 5px 3px 5px;
      border: 0;
      border-radius: 0;
      margin: 0;
      -moz-box-shadow: 0 1px 3px #999;
      -webkit-box-shadow: 0 1px 3px #999;
      box-shadow: 0 1px 3px #999;
    }
    
    
    input[type=submit] {
      font: 14px "Trebuchet MS";
      background-color: #222;
      background-image: -moz-linear-gradient(top, rgba(255,255,255,.25), rgba(255,255,255,.11));
      background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, rgba(255,255,255,.25)),color-stop(1, rgba(255,255,255,.11)));
      background-image: -webkit-linear-gradient(rgba(255,255,255,.25), rgba(255,255,255,.11));
      color: #fff;
      text-rendering: optimizeLegibility;
      text-shadow: 0 -1px 1px #222;
      padding: 3px 5px 3px 5px;
      border: 0;
      border-radius: 0;
      border-bottom: 1px solid #222;
      margin: 0;
      -moz-box-shadow: 0 1px 3px #999;
      -webkit-box-shadow: 0 1px 3px #999;
      box-shadow: 0 1px 3px #999;
    }
    
    input[type=submit].first {
      border-top-left-radius: 5px;
      border-bottom-left-radius: 5px;
    }
    
    input[type=submit].last {
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
    }
    
    input[type=submit].active {
      background-color: rgb(65,102,133);
    }
    
    input[type=submit]:hover {
      background-color: steelblue;
    }