title: Special CSS Gradients with 2 colors
body: <p>I have to create a button which should look like the image attached with css:</p>
  
  <p><img src="https://i.stack.imgur.com/jl3Gm.png" alt="Sample"></p>
  
  <p>I have no problem to get the border-radius of course, but I have no idea how to achive the color?</p>
  
  <p>I tried somehing like this:</p>
  
  <pre><code>.button {
      border-radius: 0 4px 4px 0;
      background-image: linear-gradient(to bottom, #000000 0%, #ffffff 50%, #000000 100%);
      display: inline-block;
      line-height: 2em;
      padding: 0 10px;
      color: #FFF;
  }
  </code></pre>
  
  <p>but it doesn't looks like the button at all :(. See also <a href="http://jsfiddle.net/mcqb6zf7/" rel="nofollow noreferrer">http://jsfiddle.net/mcqb6zf7/</a>.
  Can anybody help me?</p>