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 ...
随机推荐
- Leetcode 289 Game of Life
According to the Wikipedia's article: "The Game of Life, also known simply as Life, is a cellul ...
- python爬虫学习--防盗链
一 首先要了解什么是盗链 盗链是指服务提供商自己不提供服务的内容,通过技术手段绕过其它有利益的最终用户界面(如广告),直接在自己的网站上向最终用户提供其它服务商的服务内容,骗取最终用户的浏览和点击率. ...
- apicloud教程3 （转载）
本帖最后由 中山赢友网络科技有限公司 于 2015-10-26 16:44 编辑 继<APICloud之小白图解教程系列(一):认识APICloud><APICloud之小白图解教程 ...
- wordpress建站过程4——index.php
<?php get_header(); ?> <div id="primary" class="content-area col-md-9"& ...
- Python基础学习7---异常处理
处理异常 我们可以使用 try..except 语句来处理异常.我们把通常的语句放在try-块中,而把我们的错误处理语句放在except-块中. import sys try: s = raw_inp ...
- VBS获取Ini配置文件一个节点下的所有字段的值
''* 功能:使用VBS读取ini文件中指定节点下的所有值'* 输入参数:inipath :ini文件的地址'* initypes :ini文件中包含在"["和 ...
- Chapter 1 First Sight——30
The girl sitting there giggled. I'd noticed that his eyes were black — coal black. 那个坐在那里的女孩笑着.我注意到她 ...
- leetcode70
You are climbing a stair case. It takes n steps to reach to the top. Each time you can either climb ...
- Python使用os.listdir()函数来获得目录中的内容
摘自:http://it.100xuexi.com/view/otdetail/20130423/057606dc-7ad1-47e4-8ea6-0cf75f514837.html 1.在Pyth ...
- 15分钟快速开发一个kissy组件（流程篇）
Step1: 安装kissy gallery组件工具 npm install yo grunt-cli -g npm install generator-kissy-gallery -g 请确保本地带 ...