消失的列表背景
浏览:2880次 出处信息
IE6中设定了position: relative; float: left的容器下,如果存在着多个带有背景的列表,那么这些列表中有一部分会显示不正常,具体的表现为背景消失。例如下面的代码(请在IE6中查看):
| 以下是代码片段: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>TEST</title> </head> <style type="text/css"> #container { position: relative; float: left; } #container li { background: red; } </style> <body> <div id="container"> <ul> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> </ul> <ul> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> </ul> <ul> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> </ul> </div> </body> </html> |
解决的方法是给li也加上position: relative。这个BUG的具体描述,请参考:http://www.positioniseverything.net/explorer/ie-listbug.html
建议继续学习:
- 浏览器对居中的背景图片的兼容性 (阅读:3564)
- 一张背景实现自适应九宫格 (阅读:3515)
- 渐变背景上的内容垂直居中 (阅读:3314)
- 缩小窗口<body>背景被裁掉 (阅读:3193)
- 一个标签应用三个背景图片 (阅读:3199)
- 两侧背景自动延伸的CSS实现方法 (阅读:2960)
- Rax 系列教程(长列表) (阅读:2957)
- 无缝背景的推荐 (阅读:2790)
- 搜索结果显示:栅格视图还是列表视图? (阅读:2819)
- 页面元素的背景及boder被裁掉 (阅读:2699)
QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
扫一扫订阅我的微信号:IT技术博客大学习
<< 前一篇:IE6,IE7中负缩进的问题
后一篇:让IE支持RGBa的背景色 >>
文章信息
- 作者:小寒 来源: 记事本
- 标签: 列表 背景
- 发布时间:2010-08-15 09:40:29
建议继续学习
近3天十大热文
-
[322] WordPress插件开发 -- 在插件使用 -
[150] 解决 nginx 反向代理网页首尾出现神秘字 -
[91] IOS安全–浅谈关于IOS加固的几种方法 -
[50] Linux Used内存到底哪里去了? -
[50] 二维码的生成细节和原理 -
[50] 到底什么是MVC? -
[47] Shell的那些事儿 -
[47] 中间件和稳定性平台 -
[47] Hacker News 排名算法工作原理 -
[46] 浏览器的工作原理:新式网络浏览器幕后揭秘
