title: create "shiny" effect using css gradient
body: <p>Is it possible to create a gradient like that of the shiny effect on the iphone in the link below using only css?<br><a href="http://prntscr.com/22oa4f" rel="nofollow">http://prntscr.com/22oa4f</a><br><br>
  I've tried using the following code but it isn't "shiny"<br></p>
  
  <pre><code>background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, .15)), to(rgba(0, 0, 0, .25))), -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, .1)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0)));
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
  background-image: linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
  </code></pre>
  
  <p>I've created a container in this jsfiddle -> <a href="http://jsfiddle.net/3qWYL/" rel="nofollow">http://jsfiddle.net/3qWYL/</a></p>