title: Border Gradient
body: <p>I'm trying to make the border of a div have a gradient as seen <a href="http://designshack.net/tutorials/introduction-to-css3-part-2-borders" rel="nofollow noreferrer">here</a>, under the 'Gradient' heading. </p>
  
  <p><img src="https://i.stack.imgur.com/Vvpnl.png" alt="enter image description here"></p>
  
  <p>I've put the code shown on this site into a jsfiddle, <a href="http://jsfiddle.net/Df7U8/" rel="nofollow noreferrer">here</a>, but as you can see, it doesn't work.</p>
  
  <pre><code>.border_gradient {
      border: 8px solid #000;
      -moz-border-bottom-colors:#897048 #917953 #a18a66 #b6a488 #c5b59b #d4c5ae #e2d6c4 #eae1d2;
      -moz-border-top-colors:  #897048 #917953 #a18a66 #b6a488 #c5b59b #d4c5ae #e2d6c4 #eae1d2;
      -moz-border-left-colors: #897048 #917953 #a18a66 #b6a488 #c5b59b #d4c5ae #e2d6c4 #eae1d2;
      -moz-border-right-colors:#897048 #917953 #a18a66 #b6a488 #c5b59b #d4c5ae #e2d6c4 #eae1d2;
      padding: 5px 5px 5px 15px;
      width: 300px;
  }
  </code></pre>
  
  <p>Can anyone point me in the right direction for how to accomplish such a gradient? Thanks in advance.</p>