<!DOCTYPE html>

 <html>

     <head>

         <meta charset="utf-8">

         <title></title>

         <style>

             .box{

                 width: 200px;

                 height: 200px;

                 border: 1px solid black;

                 position: relative;

             }

             .item{

                 width: 150px;

                 height: 150px;

                 background-color: red;

                 float: left;

                 margin-left: 50px;<!--浮动元素有一个margin需要加上display：inline否则在ie6会出现双边距-->

                 *display: inline;

             }

             .box span{

                 width: 50px;

                 height: 50px;

                 background-color: yellow;

                 position: absolute;

                 right: -10px;

                 top:-10px;

             }

         </style>

         <!--

             解决方案：

                 在IE6的情况下......浮动元素和绝对定位元素是同级的话定位元素就会消失。所以咱们只要让他们俩不处于同级就可以避免这个bug。譬如37行代码

         -->

     </head>

     <body>

         <div class="box">

             <div class="item"></div>

             <p>

                 <span></span>

             </p>

         </div>

     </body>

 </html>

IE6下绝对定位元素和浮动元素并列绝对定位元素消失的更多相关文章

  1. ie6下常见的bug 调整页面兼容性

    ie6下常见的bug 我们布局页面,首先符合标准,如何写一个页面的标准性? 但是ie6等浏览器本身就比较特殊,bug比较多,兵法云,知己知彼百战百胜.我们需要了解ie6的一些常见bug,这样,更好的调 ...

  2. 使IE6下PNG背景透明的七种方法任你选

    原文地址:http://blog.csdn.net/mosliang/article/details/6760028 相信如何解决png在ie6下透明的问题困扰了很多人.为了追求更好的页面效果,很多人 ...

  3. 【css】绝对定位的元素在 ie6 下不显示

    问题描述: 在 ie6 中如果一个浮动元素与绝对定位元素相邻的话,在某些情况下绝对定位元素将会消失. 产生原因: 只有当绝对定位元素的邻近浮动元素的宽度大于父层宽度减 3 时(即如果父层宽度是 300 ...

  4. IE6下position解决父元素被撑开的问题

    在IE6下面当子元素的宽度/高度大于父元素时, 父元素的宽度/高度就被撑开.IE7以上是不会被撑开的 <style> .f{width:100px; height:100px; backg ...

  5. ie6下js更新元素display:block后，仍然不显示的hack办法

    $hotGames.html(html).removeClass("hide").show();//代码执行到这里,在ie6下仍然无法正常显示 //只有执行了下边的两行代码后,才正 ...

  6. 1 background（复合属性）与font（复合属性） 2 行内块的间距问题 3 行内元素的margin 4 清除浮动 5定位的元素的层级 6 Border-radius: 边框半径

    1 background(复合属性)与font(复合属性): background: 颜色  图片的链接  是否平铺  背景位置 是否滚动.(可以随意调动或省略) Font: 粗度 字体风格 字体大小 ...

  7. IE6下margin时，float浮动产生双倍边距

    今天遇到了一个IE6下的兼容性问题,虽然IE6已经不被大众所期待了,用户也已基本上消失的所剩无几,但是,作为一个问题而存在,我们有必要尝试的去研究一下bug的改善方法 对元素float-left,然后 ...

  8. 【CSS】思考和再学习——关于CSS中浮动和定位对元素宽度/外边距/其他元素所占空间的影响

      一.width:auto和width:100%的区别   1.width:100%的作用是占满它的参考元素的宽度.(一般情况下参考元素 == 父级元素,这里写成参考元素而不是父级元素,在下面我会再 ...

  9. CSS中浮动和定位对元素宽度/外边距/其他元素所占空间的影响

    ---恢复内容开始--- 一.width:auto和width:100%的区别   1.width:100%的作用是占满它的参考元素的宽度.(一般情况下参考元素 == 父级元素,这里写成参考元素而不是 ...

  10. 解决IE6,IE7下子元素使用position:relative、父元素使用overflow:auto后，子元素不随着滚动条滚动的问题

    解决IE6,IE7下子元素使用position:relative.父元素使用overflow:auto后,子元素不随着滚动条滚动的问题   在IE6,IE7下,子元素使用position:relati ...

随机推荐

  1. java反射机制（2）

    首先,我们在开始前提出一个问题: 1.在运行时,对于一个java类,能否知道属性和方法:能否去调用它的任意方法? 答案是肯定的. 本节所有目录如下: 什么是JAVA的反射机制 JDK中提供的Refle ...

  2. mysql备份并自动压缩命令

    #! /bin/bash mysqldump -uroot -p'password' databasename | gzip > /home/backup/database_`date +%Y% ...

  3. postgreSqL的序列sequence

    PostgreSQL uses sequences to generate values for serial columns and serial columns are generally wha ...

  4. 2.Add Two Numbers-两个单链表相加

    You are given two linked lists representing two non-negative numbers. The digits are stored in rever ...

  5. Struts2之checkboxlist 设置默认值和结果回显

    <s:checkboxlist list="#{'篮球':'篮球','足球':'足球','排球':'排球'}"></s:checkboxlist> 这么定义 ...

  6. c语言结构体指针必须初始化

    先说结论 结构体指针需要初始化 结构体指针的成员指针同样需要初始化 结构体变量定义的时候就已经分配了内存空间,而上面两个确没有 struct test{ int i; struct buf *p;} ...

  7. sql 查询一段时间内某个时间点数据

     SELECT  CONVERT(VARCHAR(10), dtCreateTime, 120) AS dtStatisticsCreateDate, COUNT(1) AS nStatisticsC ...

  8. ASP.NET应用程序的生命周期

    对基于.Net平台的Web应用程序开发者来说,编写适合的应用程序生命周期的代码是非常重要的.所以必须要了解应用程序生命周期才能在适当的生命周期阶段编写合适代码,达到预期的效果.ASP.NET应用程序的 ...

  9. ZOJ 2158 POJ 1789 Truck History

    最小生成树,主要是题目比较难懂. #include <cstdio> #include <cstring> #include <cmath> #include &l ...

  10. JavaScript在智能手机上的应用-测试是否支持滑动事件

    ---------------------------- <script type="text/javascript">                        ...