你的位置:首页 > 软件开发 > 网页设计 > 报告一个IE很奇葩的滚动条问题——百分比计算宽度为浮点数时的滚动条显示异常

报告一个IE很奇葩的滚动条问题——百分比计算宽度为浮点数时的滚动条显示异常

发布时间:2015-12-09 17:00:06
起因:  做项目的时候做了一个表格内容超过DIV容器自动横向滚动处理。别的浏览器都正常;但是在IE下面明明表格table和容器DIV宽度一致但是却出现了滚动条。如图    然后本人做实验找了半天原因终于是找到了,是IE浏览器使用百分比计算宽度值不是整数值引起的。 实例1:使用 ...

起因:

  做项目的时候做了一个表格内容超过DIV容器自动横向滚动处理。别的浏览器都正常;但是在IE下面明明表格table和容器DIV宽度一致但是却出现了滚动条。如图

  报告一个IE很奇葩的滚动条问题——百分比计算宽度为浮点数时的滚动条显示异常

  然后本人做实验找了半天原因终于是找到了,是IE浏览器使用百分比计算宽度值不是整数值引起的。

 

实例1:使用百分比计算结果是整数的情况下显示正常。

<!DOCTYPE html> <html> <head>  <meta charset='utf-8'>  <title>IE8奇葩滚动条问题实例</title>  <style type="text/css">   * {    -webkit-box-sizing: border-box;    -moz-box-sizing: border-box;    box-sizing: border-box;   }   .panel{    width:1000px;   }   .scroller{    overflow-x: auto;    width:75%;    background-color: #f00;   }   .inner{    width:750px;   height: 10px;    border: 1px solid #ddd;    background-color: #ff0;   }  </style> </head> <body>  <div class="panel">   <div class="scroller" style="height:35px;">     <div class="inner"></div>   </div>  </div> </body> </html>

原标题:报告一个IE很奇葩的滚动条问题——百分比计算宽度为浮点数时的滚动条显示异常

关键词:ie

ie
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。