I am hoping that someone could tell me how to add a gradient to my category bar.

Thanks!

do a forum search for 'juggledad colored cheat sheet' for a starting point

Juggledad - Thanks for pointing me to the CSS cheat sheet. However, I still do not know the specific info to add for a gradient. Any help you could provide would be greatly appreciated.
Thanks again!

You need to create the gradient as an inane and use it as a background image

Thanks Juggledad. I am a bit new to this and I still cannot figure out which file to add the background image that I created to or what to add. I created a background in illustrator and put it in my images folder in atahualpa theme. I don't know what or where to put in the style sheet.
Thanks for your help!

use the cheat sheet to see what items effect what part of the menu. then go to w3schools.com/css and read about the background syntax

Juggledad,
Still having trouble. I have pasted the url in the css below in each of the category options (separately) and nothing happened. Where do I put the url with the image of my gradient. I went to W3 (I have been using them). Still don't know what I am doing wrong. Can you give me a short step-by-step instruction?


/* ================================================ */
/* Page menu background */
/* ================================================ */
div#menu1 {
height: 40px;
margin-top:0px;
background: gray;
}
/* ================================================ */
/* Page Menu item's background and border */
/* ================================================ */
div#menu1 ul.rMenu {
background: gray;
border: none 0px;
}
/* ================================================ */
/* Page Menu item */
/* ================================================ */
ul.rMenu li a:link,
ul.rMenu li a:hover,
ul.rMenu li a:active,
ul.rMenu li a:visited,
ul.rMenu li {
background: gray !important;
color: #000000 !important;
}
/* ================================================ */
/* Category menu background */
/* ================================================ */
div#menu2 {
height: 40px;
margin-top:0px;
}
/* ================================================ */
/* Category Menu item's background and border */
/* ================================================ */
div#menu2 ul.rMenu {
height: 60px;
border: none 0px;
}
/* ================================================== */
/* Category Menu item */
/* ================================================== */
#menu2 ul.rMenu li a:link,
#menu2 ul.rMenu li a:hover,
#menu2 ul.rMenu li a:active,
#menu2 ul.rMenu li a:visited,
#menu2 ul.rMenu li {
color: #000000 !important;
}
/* ++++++++++++++++++++++++++++++++++++++++++++++++++ */

use the

background: url(http://yourdomain.com/path/to/your/image.jpg) repeat-x

syntax

Thank you!! Finally got it!