Why does the JQuery dialog assign different heights for two different popups?
I have two divs in two different projects that are displayed via JQuery dailog:
<div id="popupDiv">
<% Html.RenderAction("PopupAction", "Popup"); %>
</div>
$("#popupDiv").dialog(
{
autoOpen: false,
modal: true,
width: 465,
height: 586,
zIndex: 10001,
bgiframe: true
});
That code is identical in both cases, and the contents of the partial view are nearly identical (one is a test environment that I'm refining the UI against to save time, so I've tried to make them as close as possible), yet the popups get rendered with two different inline styles in FireFox:
<div id="popupDiv" class="ui-dialog-content ui-widget-content" style="width: auto; min-height: 0px; height: 475px;">
<div id="popupDiv" class="ui-dialog-content ui-widget-content" style="width: auto; min-height: 0px; height: 570px;">
I'开发者_如何学JAVAm certainly not setting those heights anywhere, and in fact have searched for those values in their corresponding projects, but have found nothing.
IE 9 doesn't seem to insert all of that style stuff, though if I set the height of the div in a style, only one of the two actually uses that height.
What would cause the JQuery dialog to specify two different heights like that?
If the contents (and the stylesheets the contents are using) aren't 100% identical, there's probably just a difference in the heights of the dialogs' contents (this may not be easy to spot visually if it's affected by margins or padding). Use Firebug's "Layout" tab to inspect the computed height of the dialog's children.
EDIT: sorry, I don't think I read this carefully enough. I didn't notice that you're setting height in the dialog options. I would expect that jQuery UI is using inline height settings to arrive at the final desired height once any inner padding you've specified in the CSS is factored in, but without seeing the pages I can't say much else. And again, Firebug's Layout tab seems like the first key tool in debugging this.
精彩评论