使JQuery对话框内容100％的宽度和高度

我创建一个div，然后在对话框中打开它。我尝试过这个div的样式，以实现内容将在两个方向上扩展到100％。使JQuery对话框内容100％的宽度和高度

我有什么企图迄今：设置div样式

#content { 
    width:auto !important; 
    height:auto !important; 
    background-color:red !important; 
    display:block !important; 
}

，并设置默认的div风格

$(div).dialog({ dialogClass: 'someStyle' }); 

.someStyle .ui-dialog-content 
{ 
    height:auto !important; 
    display:block !important; 
}

似乎没有任何工作！我覆盖宽度属性，但不能覆盖高度属性。如何破解这个？

我要实现的是这样的：http://jsfiddle.net/S3FQv/

来源

2013-02-28 Jacob

为了让内容拥有100％的高度，这个高度必须在html和body标签规定：

html, body { height:100%; margin:0; padding:0; }

而且，设置auto并不一定意味着宽度和/或高度将是100％。同样，旧版本的IE不支持width: auto;和height: auto;

如果可能的话，你不应该使用!important覆盖现有的样式，无论是。

JSFiddle example。

来源

2013-02-28 10:32:04

不知道为什么这是downvoted ...我甚至提供了一个工作的例子！ – 2013-02-28 10:43:56

是的，你的方法很好。我有反向投票 – harryg 2013-02-28 10:47:08

html，body属性和删除重要的没有办法！ – Jacob 2013-02-28 11:04:55

你可以使用jQuery的width和height属性来获取视野的像素宽度，并将这些作为一个风格到div

var w = $(window).width(); 
var h = $(window).height(); 

//Set up the dialog with the width and height set above. 
$('#myDialog').dialog({ 
    title: 'My Dialog', 
    height: h, 
    width: w 
});

看到这个小提琴：http://jsfiddle.net/URpmR/2/

您还应该添加一些额外的代码，以重新执行该功能用户应该改变自己的浏览器的大小：

$(window).resize(myFunction());

来源

2013-02-28 10:40:57 harryg

“我想通过CSS实现这一点。”..没有jQuery请.. – 2013-02-28 10:41:47

@詹姆斯答案很好。因为它是一个对话框，我们假设它通过'display：relative'或'absolute'定位在页面上其他内容的顶部。小提琴会很高兴看到一个示例 – harryg 2013-02-28 10:48:45

您已经在使用jQuery来调用对话框。为什么不使用上述方法同时应用其高度和宽度？看到这个小提琴：http：// jsfiddle。净/ URpmR/ – harryg 2013-02-28 12:03:12

设置width选项到'auto'在此发现Answer

来源

2016-06-06 23:33:58

使JQuery对话框内容100％的宽度和高度

回答

相关问题