<style>
    #gradient {
       color: #fff;
        height: 300px;
        padding: 10px;
      /* For WebKit (Safari, Google Chrome etc) */
      background: -webkit-gradient(linear, left top, left bottom, from(#00f), to(#fff));
        /* For Mozilla/Gecko (Firefox etc) */
        background: -moz-linear-gradient(top, #00f, #fff); /*background: -moz-radial-gradient(top, #00f, #fff); */
        /* For Internet Explorer 5.5 - 7 */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF0000FF, endColorstr=#FFFFFFFF);
        /* For Internet Explorer 8 */
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF0000FF, endColorstr=#FFFFFFFF)";
   }
</style>
 
<div id="gradient">
   <p>I haz gradient</p>
   <p>&nbsp;</p>
   <p>&nbsp;   </p>
</div>
   <p>&nbsp;</p>
   <p>&nbsp;   </p>

http://www.webdesignerwall.com/tutorials/cross-browser-css-gradient/