我很吓人在Internet Explorer和Mozilla Firefox中,此页面非常高!我一直在使用jQuery将元素的高度设置为几乎与元素一样高。在Chrome浏览器中看起来很完美,但是IE和FF呈现的页面确实很高。更奇怪的是,当使用Firefox的检查器时,我可以看到页面远远超出了元素的高度!
jQuery:
(function($){
var resize = function(){
var height = $('html').height();
$('#wrap > div').height(height-38);
$('html').height(height); // Added this to try and fix the height
};
$(window).resize(resize).load(resize);
})(jQuery);
HTML布局:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<!-- ... --->
</head>
<body>
<div id="wrap"><div> <!-- I want the child of #wrap to be the height of the entire page. -->
<div id="left"><div>
<!-- ... -->
</div></div>
<div id="main">
<!-- ... -->
<div class="clear"></div>
<div id="body">
<!-- ... -->
</div>
</div>
</div></div>
</body>
</html>
CSS:
html{height: 100%;}
body{background: url('images/body.jpg') no-repeat fixed left top; border: 8px solid #BBB0A2; border-width: 8px 0 0 6px; min-width: 902px;}
#wrap{max-width: 1130px;}
#wrap > div{float: right;}
#main{float: left; width: 630px; height: 100%; padding: 10px 20px 20px 20px; background: #FFFFFF;}
#body{margin-top: 20px; font: 13px/18px Georgia, serif; color: #AE9073; position: relative;}
这是我尝试使用的网站:http://www.phoenixarizonashutters.com/
谢谢你的帮助。
最佳答案
您包含的代码无法证明问题所在,但是如果我访问您的网站,则可以看到以下两个元素:
<div style="height: 695px;">...</div>
<div class="clear" style="height: 695px;"></div>
您的clearing div可能不需要高度-删除造成这种高度的任何东西,您的网站就会变得更加合理。
关于jquery - 为什么我的页面比<html>元素高?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/13846158/