Apply CSS to jQuery Dialog Buttons

Question

So I currently have a jQuery dialog with two buttons: Save and Close. I create the dialog using the code below:

$dialogDiv.dialog({
    autoOpen: false,
             


        

Answer 1

I think there are two ways you can handle that:

1. Check using something like firebug if there is a difference (in class, id, etc.) between the two buttons and use that to address the specific button
2. Use something like :first-child to select for example the first button and style that one differently

When I look at the source with firebug for one of my dialogs, it turns up something like:

    Send
    Cancel

So I could for example address the Send button by adding some styles to .ui-state-focus (with perhaps some additional selectors to make sure I override jquery's styles).

By the way, I´d go for the second option in this case to avoid problems when the focus changes...