"float: right" bug in IE :在IEfloat-right外围容器中文字不见了！
css :
body {
margin: 10px 50px;
}
#contener {
border: 1px solid #000;
background-color: yellow;
}
#floatRight {
float: right;
border: 1px solid red;
color: red;
width: 30%;
}
#contenu {
border: 1px solid blue;
color: blue;
}
.spacer {
clear: both;
border: 1px solid #FF00FF;
color: #FF00FF;
} |
xhtml :
<div id="contener">
<b>#contener</b>
<div id="floatRight">
<b>#floatRight</b> : Float block at the right of the block #contenu
</div>
<div id="contenu">
<b>#contenu</b> : Simple block
</div>
<div class='spacer'>
<b>.spacer</b> : a "spacer" block...
</div>
</div>
|
正确应该显示为:
Internet Explorer 6 显示为 :
#contener 层的文字和#contenu层不见了! 只有#contener的背景颜色!
解决办法 :
body {
margin: 10px 50px;
}
#contener {
position: relative; /* 增加的 */
border: 1px solid #000;
background-color: yellow;
}
#floatRight {
position: relative; /* 增加的*/
float: right;
border: 1px solid red;
color: red;
width: 30%;
}
|
 [xhtml/css]float:right
by banket posted at oioj on 2006-6-29 16:49:59 Weather: 晴 |
"float: right" bug 在IE中float-right外围容器的margin-left失效. css : body {
margin: 0px;
}
#contener {
border: 1px solid #000;
margin: 10px 50px;/*左右外补丁margin=50px*/
}
#floatRight {
float: right;
border: 1px solid red;
color: red;
width: 30%;
}
#contenu {
border: 1px solid blue;
color: blue;
}
.spacer {
clear: both;
border: 1px solid #FF00FF;
color: #FF00FF;
} |
xhtml :
<div id="contener">
<b>#contener</b>
<div id="floatRight">
<b>#floatRight</b> : Float block at the right of the block #contenu
</div>
<div id="contenu">
<b>#contenu</b> : Simple block
</div>
<div class='spacer'>
<b>.spacer</b> : a "spacer" block...
</div>
</div> |
正确显示为:  Internet Explorer 6 显示为: 
IE6.0中#contener的margin-left无效!
解决办法: body {
margin: 10px 50px; /* 给body增加marign */
}
#contener {
border: 1px solid #000;
/* margin: 10px 50px; 取消#contener的margin,也就是给他外围增加margin替代自身margin*/
}
|
|
|
[xhtml/css]float:right "float: right" bug 在IE中float-right外围容器的margin-left失效.
css :
body {
margin: 0px;
}
#contener {
border: 1px solid #000;
margin: 10px 50px;/*左右外补丁margin=50px*/
}
#floatRight {
float: right;
border: 1px solid red;
color: red;
width: 30%;
}
#contenu {
border: 1px solid blue;
color: blue;
}
.spacer {
clear: both;
border: 1px solid #FF00FF;
color: #FF00FF;
} |
xhtml :
<div id="contener">
<b>#contener</b>
<div id="floatRight">
<b>#floatRight</b> : Float block at the right of the block #contenu
</div>
<div id="contenu">
<b>#contenu</b> : Simple block
</div>
<div class='spacer'>
<b>.spacer</b> : a "spacer" block...
</div>
</div> |
正确显示为:
Internet Explorer 6 显示为:
IE6.0中#contener的margin-left无效!
解决办法:
body {
margin: 10px 50px; /* 给body增加marign */
}
#contener {
border: 1px solid #000;
/* margin: 10px 50px; 取消#contener的margin,也就是给他外围增加margin替代自身margin*/
}
|
posted on 2006-07-12 14:03
汪杰 阅读(166)
评论(0) 编辑 收藏 引用 所属分类:
div css dhtml