html - How to add vertical gradient using css? -
i have vertical submenu under:
<div id="dropdown_menu" class="menu"> <ul> <li> <a>first link</a></li> <li> <a>second link</a></li> </ul> </div>
i putting bottom piece of background in css class 'menu'., top slice of background in .menu ul. now, have 1 vertical gradient changes color top down (in whole vertical menu) , therefore cannot put in .menu ul li. possible add vertical gradient without making change html?
#dropdown_menu { filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#ff280c00', endcolorstr='#004a1d00'); /* ie */ background: -webkit-gradient(linear, left top, left bottom, from(#280c00), to(rgba(75, 30, 0, 0))); /* webkit browsers */ background: -moz-linear-gradient(top, #280c00, rgba(75, 30, 0, 0)); /* firefox 3.6+ */ }
see actual implementation here: http://www.salonbelledesoir.com (the gradients around edge css gradients.)
this not work in opera (though there may -o-gradient
property don't know about.
or, can use regular background images, repeated accordingly.
Comments
Post a Comment