Gradiente com CSS3

Esta postagem que venho trazer é para ensinar a vocês como aplicar um Gradiente com CSS3. A vantagem aplicar gradiente é que ao envés de você usar uma imagem como backround de um "Menu" por exemplo, você simplesmente aplica o gradiente, que acaba se tornando mais elegante e bem mais rápido de ser aplicado.

A demonstração que esta logo abaixo eu não usei imagem, adicionei apenas: gradiente, border radius e defini as limitações (width e height) é claro.

Para aplicar o gradiente basta colocar isso em seu CSS:

background: -webkit-gradient(linear, left top, left bottom, from(#e1e1e1), to(#bfbfbf)) repeat-x bottom left;
background: -moz-linear-gradient(top, #e1e1e1, #bfbfbf);
Para navegadores com Webkit (Chrome, Opera, IE):

background: -webkit-gradient(linear, left top, left bottom, from(#e1e1e1), to(#bfbfbf)) repeat-x bottom left;
Para Mozilla Firefox Moz-Linear:

background: -moz-linear-gradient(top, #e1e1e1, #bfbfbf);
Portanto, para que seu gradiente tenho uma boa funcionalidade em todos os navegadores terá que aplicar os dois background no mesmo elemento com as cores nas mesmas direções.

*Esse código na tem funcionalidade em modelos antigos do Internet Explorer(IE).