asfman
android developer
posts - 90,  comments - 213,  trackbacks - 0
 "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%;
}


Read More,Comments(0)
 


[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 汪杰 阅读(385) 评论(0)  编辑 收藏 引用 所属分类: div css dhtml
只有注册用户登录后才能发表评论。

<2006年4月>
2627282930311
2345678
9101112131415
16171819202122
23242526272829
30123456

常用链接

留言簿(15)

随笔分类(1)

随笔档案(90)

文章分类(727)

文章档案(712)

相册

收藏夹

http://blog.csdn.net/prodigynonsense

友情链接

最新随笔

搜索

  •  

积分与排名

  • 积分 - 467490
  • 排名 - 6

最新随笔

最新评论

阅读排行榜

评论排行榜