Setting iframe width in jQuery dialog

I was trying to open an iframe inside a dialog and the problem was that the width of the iframe was set to auto, occupying only a fraction of my dialog.

The solution I came up with was to set min-width, instead of width. Wrapping the iframe in a div, as suggested elsewhere did not work.

You will need to leave some space to show the vertical scroll bar, so set min-width to something like 95% of your dialog.

HTML:

 <iframe id="frame1" style="display:none; min-width: 95%;">

JavaScript:

$("#frame1").dialog({
   width: 500px,
   height: 200px,
   modal: true
});

4 thoughts on “Setting iframe width in jQuery dialog

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s