how to change the dialog text size in jquery

Question

Hi I want to change the dialog text size.Dynamically I created th dialog, I need to change the text size.How to do this? Kindly guide me.

function validate_email(){
                window.$required = $("#dialog").dialog({
                  width: 300,
                  height: 450,

                    autoOpen: false,
                           buttons: {
                'Complete': function() {
                   checkstatus(userid);
                }
              }
                });
            $required.html('Your account setup has been initiated. 
started.').dialog('open');//here my text
            }

Answer 1

You can use .css() to modify the style of your dialog:

function validate_email(){
     window.$required = $("#dialog").dialog({
         width: 300,
         height: 450,
         autoOpen: false,
         buttons: {
            'Complete': function() {
               checkstatus(userid);
            }
          }
     }).css("font-size", "20px");

     $required.html('Your account setup has been initiated. started.').dialog('open');//here my text
}

Answer 2

In your style-sheet you can set the font for the whole dialog and/or for elements within it:

<style>
#dialog { font-size: 25px; }
#dialog h2 { font-size: larger; }
#dialog div { font-size: 20px; }
#dialog div.bigger { font-size: 150%; }
#dialog p { font-size: x-small; background-color: blue; }
</style>

Where the font-size property accepts a number of different units.

Of course you can also set other CSS properties in the same way, as shown on the last line of my example above.