How to remove fade from gradient in css

Question

I have got following button in my html code
<input type="button" id="button" title="button" name="button" class="button" value="button" />
and this css attached

.button{
  width:200px;
  height:;50px;
  position:relative;
  top:50px;
  left:200px;
  background:-webkit-linear-gradient(180deg,white 33%,blue 67%)
}

https://jsfiddle.net/mudkcuqj/

Now my spirit desires to remove that heinous fade which is caused by gradient

Answer 1

If you're looking to remove the fade from blue to white, and have it be blue up until a point, then change to white, have the colors start and end at the same point.

.button{
  width:200px;
  height:50px;
  position:relative;
  top:50px;
  left:200px;
  background:linear-gradient(180deg,white 33%,blue 33%);
  background:-webkit-linear-gradient(180deg,white 33%,blue 33%);
}

<input type="button" id="button" title="button" name="button" class="button" value="button" />