JQuery UI and theming

Question

I downloaded JQuery UI and added the script to my solution, and with a small amount of code, I have a beautiful date picker.

However, I need to use my own theme from my css file. I have created the date picker as per the example code, but it has no style. That is, it appears over existing text. Is there a way I can assign a css style from my existing css file, to make the background of the calendar no be transparent, and use my colours?

Answer 1

The easiest way is to generate the JQuery UI theme using the ThemeRoller to match your current theme. It's much better than you create it by hand since you will need to match all the CSS namings used by JQuery UI,

Answer 2

You can add your CSS property background for your theming on the following line in file jquery-ui-1.8.6.custom.css :

.ui-datepicker { width: 17em; padding: .2em .2em 0; background: salmon;}

I change background color to salmon and you can set anything for your necessary.