title: Transition on gradient button?
body: <p>I'm trying to set a transition for this button I have on this mockup navbar I'm making and when I hover over, I want a 0.5s transition for a background change, but it isn't working I haven't really used transitions much in css, but this is what the great google has told me :</p>
  
  <pre><code>.btn-primary {
      border: 1px solid #e5e5e5;
      border-radius: 6px;
      padding: 6px;
      background: -webkit-linear-gradient(bottom, #0066FF 0, #0088FF 85%, #00AAFF 100% );
      font-size: 14px;
      color: white;
  }
  
  .btn-primary:hover {
      background: -webkit-linear-gradient(bottom, #0000CC 0, #0044CC 100%);
      cursor: pointer;
      -webkit-transition: background 0.3s linear;
  }
  </code></pre>
  
  <p>Demo: <a href="http://codepen.io/anon/pen/lApnj" rel="nofollow">http://codepen.io/anon/pen/lApnj</a></p>
  
  <p>Any information would be great thanks! :)</p>