元素设置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. vbox内部linux :centos5.5与外部ping通(相互),而且域名访问

    1 相互ping通:不能使用nat,nat只能单向通,虚拟机不能ping通主机,选择桥接: 如图: 2然后设置 ip:最好设置静态ip这样下次不用再改,这里我们只演示使用eth0网卡,=> vi ...

  2. Activity界面切换动画特效。

    效果图: 结构图: 测试代码: 布局: 1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearL ...

  3. php中日期的加减法运算

    需求:通过对某个日期增加或减去几天,得到另外一个日期1.首先通过strtotime()获得日期的时间戳2.获得N天前得时间戳,通过”当前时间戳 - N天的秒数 = N天前得时间戳“3.对N天前得时间戳 ...

  4. 用Navicat for MYsql创建表,插入中文显乱码

    段都有编码设置.出现乱码肯定是你现在用的编码混乱造成的 解决办法: 第一步 先改数据库编码 先修改你的数据库,如果你页面用的是UTF-8编码那么你数据库内的编码也需要设置为UTF-8,每个字段都需要设 ...

  5. HDU 1166 单点更新,区间求和

    敌兵布阵 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submis ...

  6. encodeURI

    encodeURI("http://www.cnblogs.com/season-huang/some other thing"); //整个URL进行编码"http:/ ...

  7. Scss sass

    http://www.ruanyifeng.com/blog/2012/06/sass.htmlscss 声明:1,$blue : #1875e7;2,.class1 { border: 1px so ...

  8. lucene4.7学习总结

    花了一段时间学习lucene今天有时间把所学的写下来,网上有很多文章但大部分都是2.X和3.X版本的(当前最新版本4.9),希望这篇文章对自己和初学者有所帮助. 学习目录 (1)什么是lucene ( ...

  9. 神奇的Noip模拟试题第一试 合理种植 枚举+技巧

    1.合理种植 (plant.pas/.c/.cpp) [问题描述] 大COS在氯铯石料场干了半年,受尽了劳苦,终于决定辞职.他来到表弟小cos的寒树中学,找到方克顺校长,希望寻个活干. 于是他如愿以偿 ...

  10. IBInspectable / IBDesignable

    无论陈词滥调多少次,比起一个需要我们记住并且输入什么的界面来说,如果替换成我们能够看见并可控制的界面的话将会是巨大的进步. Xcode 6 提供了这样一个替代,在旧技术上建立新的互动.在设计项目的时候 ...