PRE-CSS3 gradient (No images, Minimal Hacks, All browsers)

Update: after some tests, I'd recomend AGAINST svg workaround due to visual flicker happening at page load. There are posts about "-o-linear-gradient" on the net, but they are lies. Update 2: finally, opera 11.10 brings gradients (in moz syntax). Update 3: webkit now sports moz syntax too. Looks like consolidation is near. Update 4: IE10 joins the club.
|
{
background: #ffffff; /* your fallback css */
background: -webkit-linear-gradient(left,  #ffffff,  #000000); /* for chrome 10+ */
background: -moz-linear-gradient(left,  #ffffff,  #000000); /* for firefox 3.6+ */
background: -ms-linear-gradient(left,  #ffffff,  #000000); /* for IE10+ */
background: -o-linear-gradient(left,  #ffffff,  #000000); /* for opera 11.10+ */
background: linear-gradient(left,  #ffffff,  #000000); /* for the future */
}
 
 
DEMO