IE6下绝对定位元素和浮动元素并列绝对定位元素消失
<!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下绝对定位元素和浮动元素并列绝对定位元素消失的更多相关文章
- ie6下常见的bug 调整页面兼容性
ie6下常见的bug 我们布局页面,首先符合标准,如何写一个页面的标准性? 但是ie6等浏览器本身就比较特殊,bug比较多,兵法云,知己知彼百战百胜.我们需要了解ie6的一些常见bug,这样,更好的调 ...
- 使IE6下PNG背景透明的七种方法任你选
原文地址:http://blog.csdn.net/mosliang/article/details/6760028 相信如何解决png在ie6下透明的问题困扰了很多人.为了追求更好的页面效果,很多人 ...
- 【css】绝对定位的元素在 ie6 下不显示
问题描述: 在 ie6 中如果一个浮动元素与绝对定位元素相邻的话,在某些情况下绝对定位元素将会消失. 产生原因: 只有当绝对定位元素的邻近浮动元素的宽度大于父层宽度减 3 时(即如果父层宽度是 300 ...
- IE6下position解决父元素被撑开的问题
在IE6下面当子元素的宽度/高度大于父元素时, 父元素的宽度/高度就被撑开.IE7以上是不会被撑开的 <style> .f{width:100px; height:100px; backg ...
- ie6下js更新元素display:block后,仍然不显示的hack办法
$hotGames.html(html).removeClass("hide").show();//代码执行到这里,在ie6下仍然无法正常显示 //只有执行了下边的两行代码后,才正 ...
- 1 background(复合属性)与font(复合属性) 2 行内块的间距问题 3 行内元素的margin 4 清除浮动 5定位的元素的层级 6 Border-radius: 边框半径
1 background(复合属性)与font(复合属性): background: 颜色 图片的链接 是否平铺 背景位置 是否滚动.(可以随意调动或省略) Font: 粗度 字体风格 字体大小 ...
- IE6下margin时,float浮动产生双倍边距
今天遇到了一个IE6下的兼容性问题,虽然IE6已经不被大众所期待了,用户也已基本上消失的所剩无几,但是,作为一个问题而存在,我们有必要尝试的去研究一下bug的改善方法 对元素float-left,然后 ...
- 【CSS】思考和再学习——关于CSS中浮动和定位对元素宽度/外边距/其他元素所占空间的影响
一.width:auto和width:100%的区别 1.width:100%的作用是占满它的参考元素的宽度.(一般情况下参考元素 == 父级元素,这里写成参考元素而不是父级元素,在下面我会再 ...
- CSS中浮动和定位对元素宽度/外边距/其他元素所占空间的影响
---恢复内容开始--- 一.width:auto和width:100%的区别 1.width:100%的作用是占满它的参考元素的宽度.(一般情况下参考元素 == 父级元素,这里写成参考元素而不是 ...
- 解决IE6,IE7下子元素使用position:relative、父元素使用overflow:auto后,子元素不随着滚动条滚动的问题
解决IE6,IE7下子元素使用position:relative.父元素使用overflow:auto后,子元素不随着滚动条滚动的问题 在IE6,IE7下,子元素使用position:relati ...
随机推荐
- java对数计算
Java对数函数的计算方法非常有问题,然而在API中却有惊人的误差.但是假如运用了以下的方法,用Java处理数字所碰到的小麻烦就可以轻而易举的解决了. Sun的J2SE提供了一个单一的Java对数方法 ...
- jQuery版本冲突解决办法
<!-- 引入1.6.4版的jq --> <script src="<a href="http://ajax.googleapis.com/ajax/lib ...
- 多线程---优先级&yield方法
优先级只有10级,1-10.最高10(java中用Thread.MAX_PRIORITY),最低1,中间级5. 设置优先级的方法是 线程对象.setPriority(5): yield : 暂停(不是 ...
- Openjudge-计算概论(A)-分数求和
描述: 输入n个分数并对他们求和,并用最简形式表示.所谓最简形式是指:分子分母的最大公约数为1:若最终结果的分母为1,则直接用整数表示. 如:5/6.10/3均是最简形式,而3/6需要化简为1/2, ...
- redis数据类型:sets
sets类型及操作: set是集合,它是string类型的无序集合.set是通过hash table实现的, 添加.删除和查找的复杂度都是O(1).对集合我们可以取并集.交集.差集. 通过这些操作我们 ...
- 关于oracle数据库(2)
数据备份.数据删除.数据还原 连接数据库,查看scott用户下面的所有表 数据备份(数据导出)要输入导出文件路径和文件名(文件扩展名可输入也可以不输入) 导出成功后,可以在上面输入的文件路径下面看到导 ...
- 一个神奇SQL引发的故障【转】
前几天一个客户数据库主实例告警,诊断过程中发现是由一个慢SQL导致的数据库故障,而在排查逐步深入之后却发现这个现象的不可思议. 问题描述 2016年12日09日,大概9点26分左右,一个客户的生产库主 ...
- android Bind机制(二)
1.binder通信概述 binder通信是一种client-server的通信结构, 1.从表面上来看,是client通过获得一个server的代理接口,对server进行直接调用: 2 ...
- 解题的小问题(C++)
1.判断一个数是否为整数 if(m==(int)m) 2.#include <bits/stdc++.h>using namespace std;int main(){ int n ...
- STM32F207 两路ADC连续转换及GPIO模拟I2C给MT9V024初始化参数
1.为了更好的方便调试,串口必须要有的,主要打印一些信息,当前时钟.转换后的电压值和I2C读出的数据. 2.通过GPIO 模拟I2C对镁光的MT9V024进行参数初始化.之前用我以前公司SP0A19芯 ...