码迷,mamicode.com
首页 > 其他好文 > 详细

font-size引起的页面晃动

时间:2015-01-14 00:38:37      阅读:231      评论:0      收藏:0      [点我收藏+]

标签:

如下图中的场景,页面分为头和内容两个大块,head高度是50PX,1PX的border,中间的内容是iframe,高度需要每次进行计算,如下

<script>
$(function(){ setIframeHeight(); }) function setIframeHeight(){ $("#mainFrame").height(document.body.clientHeight-52); } $(window).resize(function() { setIframeHeight(); });
</script>

IE、Firefox测试下来都OK,结果在测试chrome的时候,发现上下有晃动,之后各种找问题,发现多了5PX。

最终发现是因为div元素的font-size引起的,最后设置font-size:0; 纠结3小时的问题终于解决了。。。

<div class="row">
  <div  class="col-md-12" style="font-size: 0;">
	<iframe  id="mainFrame" name="mainFrame"src="addOrder.html" frameborder="No" marginwidth="0" title="mainFrame" scrolling="auto" style="width: 100%;height:100%;"> </iframe>
  </div>
</div>    

  

 

技术分享

font-size引起的页面晃动

标签:

原文地址:http://www.cnblogs.com/justang/p/4222907.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!