javascript - How to change background color of jQuery UI Dialog?

Question

I am having tough time figure out how to change background color of jQuery UI Dialog.

I've seen many reference how to change/remove title bar but not entire background including those curvy corner.

Here is my try:

http://jsfiddle.net/dEvKb/11/

The problem is .ui-widget-content only applies to square area within the dialog but not including curvy corner.

I found a class .ui-corner-all class hoping it will color the entire background but only half of the dialog is colored. (you can see this in the jsfiddle)

Has anyone done this before?

Answer 1

you can use this way

http://jsfiddle.net/dEvKb/15/

You should set to all class background with use !important.

.ui-dialog,.ui-widget, .ui-widget-content, .ui-corner-all, .foo, .ui-draggable, .ui-resizable {background:yellow !important}?