元素设置position:fixed属性后IE下宽度无法100%延伸

IE bug 出现条件：

1、div1设置position:fixed属性，并且想要width:100%的效果。

2、div2(下层元素)设置了宽度并居中。

解决方案：

.div1{left:0}即fixed层设置left值为0。

代码如下：

 <!DOCTYPE html>

 <html>

 <head>

 <title>test</title>

 <style>

 *{margin:0px;padding:0px}

 .div1{position:fixed;height:40px;background:#666;width:100%;color:#fff}

 .div2{width:980px;margin:0 auto}

 </style>

 </head>

 <body>

     <div class="test">

         <div class="div1">元素设置position:fixed属性后IE下宽度无法100%延伸</div>

         <div class="div2">div2设置了宽度</div>

     </div>

 </body>

 </html>

元素设置position:fixed属性后IE下宽度无法100%延伸的更多相关文章

  1. CSS关于子元素设置了float属性后父元素高度为0的解释和解决方法

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  2. 内层元素设置position:relative后父元素overflow:hidden overflow:scroll失效 解决方法

    内层元素设置position:relative后父元素overflow:hidden overflow:scroll 都失效 解决方法:在position:relative的外层父容器加positio ...

  3. 解决IE6不支持position:fixed属性

    最近在优化网站浮动广告时候遇见了IE6不支持position:fixed属性.上网收集了一下解决方案 比较好的方案就是利用css表达式进行解决 补充:CSS Expression (CSS 表达式), ...

  4. 小技巧css解决移动端ios不兼容position:fixed属性，无需插件

    移动端开发仿app头部底部固定设置position:fixed,android2.2以上已经实现.但是在ios8以下系统,当小键盘激活时,都会出现位置浮动问题.如图: 如何解决: 查阅资料之后想到一下 ...

  5. IOS系统不兼容position: fixed;属性的解决方案

    position: fixed;属性在IOS系统手机上会有很明显的抖动,解决方式: 只需要在中间部分外层div添加css样式position:fixed;top:50px; bottom:50px;o ...

  6. [Web 前端] inline-block元素设置overflow:hidden属性导致相邻行内元素向下偏移

    cp from : https://blog.csdn.net/iefreer/article/details/50421025 在表单修改界面中常会使用一个标签.一个内容加一个修改按钮来组成单行界面 ...

  7. 关于js拖拽功能，拖拽元素的position:fixed;left:0;right:0;样式引起左右拖动元素会出现落后鼠标移动距离的问题

    被拖拽元素的样式如果为:position:fixed;left:0;right:0;(当时是为了让fixed定位的元素水平居中加的left:0;right:0;避免js动态计算定位的麻烦)时左右拖动会 ...

  8. ie7中position:fixed定位后导致margin:0 auto;无效

    布局网页时,需要把header固定在上方.直接使用position:fixed;现代浏览器以及ie8以上均正常显示,但是ie7中,header里面的子元素设置的水平居中并没有效果.做了各种尝试,都没有 ...

  9. 使用storyboard设置button边框属性（颜色，宽度，圆角）

    通常使用Category时.仅仅能加入方法,不可加入属性.可是在使用Storyboard时我们可能会使用到keyPath,这里设置的key都须要是所设置视图的属性值.而且类型有所限制. 比如:我如今有 ...

随机推荐

  1. SQL逻辑读变成零

    使用缓存HINT 让逻辑读变成0. create table t as select * from dba_objects; insert into t select * from t; commit ...

  2. 再谈IT行业工程师文化

    为什么是再呢?因为“工程师文化”这种说法网上很多,各种理解,各种版 本,我只是简单说说我的认识,说的不对的地方敬请各位大牛,高手,高高手多多指教,我本身也是个技术人员,不过只是技术不怎么样而已.写这个 ...

  3. wdcp升级php版本到5.3,5.5

    官网省级方法 wget http://down.wdlinux.cn/in/php_up53.shsh php_up53.sh 看到"php update is OK"提示表示,顺 ...

  4. visualSVN server库迁移

    首先,VisualSVN Server Manager,包含两个路径,一个是安装路径,例如本机:C:\Program Files\VisualSVN Server,一个是库路径,例如本机:C:\Rep ...

  5. lucas 定理学习

    大致意思就是求组合数C(n , m) % p的值, p为一个偶数 可以将组合数的n 和 m都理解为 p 进制的表示 n  = ak*p^k + a(k-1)*p^(k-1) + ... + a1*p ...

  6. Section 1.4 Packing Rectangles

    本来是USACO Training的1.4.1的,但是介于今早过了食物链想起了这道题实在是太怨念了,翻出自己写的AC程序居然有5KB!! 思路很简单,枚举,而且就图中的六种情况.但是第六种变化状况太多 ...

  7. UTF-8 有BOM和无BOM

    BOM(byte order mark)是为 UTF-16 和 UTF-32 准备的,用于标记字节序(byte order).微软在 UTF-8 中使用 BOM 是因为这样可以把 UTF-8 和 AS ...

  8. Android ScrollView与ViewPager滑动冲突

    前段时间做项目碰到在ScrollView里添加ViewPager,但是发现ViewPager的左右滑动和ScrollView的滑动冲突了,解决这个问题的方法是重写ScrollView. 代码: pub ...

  9. PHP汉字转拼音类

    看到的文章,转过来留用,哈哈 汉字转拼音类(全拼与首字母) <?php class GetPingYing { private $pylist = array( 'a'=>-20319, ...

  10. Visual Studio 2015 预览版 - 支持跨平台开发Android/iOS应用程序(内置安卓模拟器)

    微软最近的惊人举动真多,对普通消费者Office 移动版宣布免费,对开发者也发布了完全免费的 VS2013 社区版! 不仅如此,就连 .Net 开发框架环境也竟然「开源」并且跨平台支持 Mac 及 L ...