【发布时间】:2011-04-01 15:33:28
【问题描述】:
这是一个html页面:
<html>
<head>
<title>
Frame Set
</title>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<link rel="stylesheet" href="frame.css" type="text/css" media="screen" />
<script language="JavaScript" type="text/javascript">
$(document).ready(function() {
var winSize = $(window).width();
var margin = (winSize-1000)/2;;
$('#main').css({'margin-left':margin,'margin-right':margin});
}
)
$(function() {
$(".frame").each(function() {
var width = ($(this).find('.h').width()),
height = $(this).find('.l').height(),
pad = $(this).find('.h').position().left,
actWidth = width + 10,
nHeight = height - (height * 2),
rLeftMargin = actWidth - 1,
bWidth = actWidth;
$(this).find('.r').css({'margin-top':nHeight, 'margin-left':rLeftMargin, 'height':height});
$(this).find('.h').css({'height':25});
$(this).find('.b').css({'width':bWidth, 'margin-top':0});
});
});
</script>
</head>
<body>
<div id="main" align="center" style="width:1000px; height:100%; text-align:left;">
<div id="inner1" style="width:100%; height:20%; float:top; margin-bottom: 20px;">
<div id="inner11">
<div class="frame">
<div class="h" style="width:100%">Header</div>
<div class="l" style="height:93%"></div>
<div class="r"></div>
<div class="b"></div>
</div>
</div>
</div>
<div id="inner2" style="width:100%; height:60%;">
<div id="inner21" style="width:69%; float:left; margin-left: 1px; margin-right: 1px;">
<div class="frame">
<div class="h" style="width:100%">Left Frame</div>
<div class="l" style="height:93%"></div>
<div class="r"></div>
<div class="b"></div>
</div>
</div>
<div id="inner22" style="width:29%; float:right; margin-left: 1px; margin-right: 1px;">
<div class="frame">
<div class="h" style="width:100%">Right Frame</div>
<div class="l" style="height:93%"></div>
<div class="r"></div>
<div class="b"></div>
</div>
</div>
</div>
<div id="inner3" style="width:100%; height:20%; float:bottom; margin: 2px 2px 2px 2px;">
<div id="inner23">
<div class="frame">
<div class="h" style="width:100%">Footer</div>
<div class="l" style="height:93%"></div>
<div class="r"></div>
<div class="b"></div>
</div>
</div>
</div>
</div>
</body>
</html>
这是 Mozilla 输出:
这是 IE8 输出:
有什么问题?
【问题讨论】:
-
欢迎来到 Web 开发的世界
-
IE! IE! IE Ftagn!
-
叹息...这是渲染,而不是输出。并且已经用标点符号停止它。
-
等你在IE6上测试!
-
@Sarang - 我对您问题中的拼写和语法进行了一些改进。我看到我是第四个这样做的人。您坚持回滚这些更正的任何特殊原因?只是指出FAQ 中的一点点如果您对其他受信任的用户正在编辑您的问题和答案的想法感到不满意,那么这可能不适合您。
标签: jquery html internet-explorer-8 rendering mozilla