How to add vertical gradient using css?

Question

I have a vertical submenu:

<div id="dropdown_menu" class="menu">
<ul>
<li> <a>First Link</a></li>
<li> <a>Second Link</a></li>
</ul>
</div>

I put the bottom of the background in the css menu "menu"., The top cut of the background in .menu ul. Now I have one vertical gradient that changes color from top to bottom (in the whole vertical menu), and therefore I can not put it in .menu ul li. Is it possible to add a vertical gradient without making any changes to the html?

Answer 1

#dropdown_menu {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF280C00', endColorstr='#004A1D00'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#280C00), to(rgba(75, 30, 0, 0))); /* for webkit browsers */
    background: -moz-linear-gradient(top,  #280C00,  rgba(75, 30, 0, 0)); /* for firefox 3.6+ */
}

See the actual implementation here: http://www.salonbelledesoir.com (Gradients around the edge are CSS gradients.)

Opera ( -o-gradient, .

, , .

Answer 2

, x- . -, . :

.gradient {
  background: #xxx url(pathtoimagedirfromcssfile/background.jpg) center top repeat-x;
}

#xxx - , - .